jquery选项卡首先仅显示初始选项卡

Question

我正在使用这个脚本：

jsfiddle.net/p95nJ/1/

但首先，当没有按下标签时，它会显示所有标签内容。我想阻止这种情况，并且首先只显示第一个标签（在按下任何内容之前）。

这是jquery：

jQuery(document).ready(function($) {

    //tabs
     $("ul.tabrow li:first").addClass("active").show(); //Activate first tab
    $(".tab-content div:first").show(); //Show first tab content
    //On Click Event
    $("ul.tabrow li").hover(function() {
        $(this).addClass("active"); //Add "active" class to selected tab
        var activeTab = $(this).find("a").attr("href"); //Find the rel attribute value to identify the active tab + content
        $(activeTab).fadeIn(); //Fade in the active content
        return false;
    }, function() {
        $("ul.tabrow li").removeClass("active"); //Remove any "active" class
        $(".tab-box").hide(); //Hide all tab content
        return false;
    });

});

这是html：

<div class="under-slider-right">
<!-- איקונים עם תמונות-->
<div class="tab-wrap">
    <ul class="tabrow">
        <li class="first"><a href="#tab_tags"></a></li>
        <li class="second"><a href="#tab_recent"></a></li>
        <li class="third"><a href="#tab_tools"></a></li>
         <li class="forth"><a href="#tab_tools"></a></li>
    </ul>


    <div class="tab-content">
        <div id="tab_tags" class="tab-box" style="display: none; ">
            <div class="taglist">
מילה מילה מילה מילה מילה מילה מילה מילה מילה מילה
            <br/>
            מילה מילה מילה מילה מילה מילה  
            </div>
            <div class="clear">
            </div>
        </div>


        <div id="tab_recent" class="tab-box" style="display: none; ">
משפט משפט משפט משפט משפט משפט משפט
            <br/>
            משפט משפט משפט משפט משפט
        </div>


        <div id="tab_tools" class="tab-box" style="display: block; ">
            טקסט טקסט טקסט טקסט טקסט טקסט טקסט 
            <br/>
            טקסט טקסט טקסט טקסט טקסט
        </div>
    </div>
</div>
</div>