点击切换的JS

$(function(){
    var tabnav = $("#tab-nav ul li");
    tabnav.click(function(){
        $(this).addClass("hover").siblings().removeClass("hover");
        var index = $("#tab-nav ul li").index(this);
        $("ul.tab-con").eq(index).fadeIn().siblings("ul.tab-con").fadeOut();
    });
});    

<div id="tab-nav">
<ul>
<li class="hover" data-tabid=""><i>最新发布</i></li>
<li data-tabid=""><i>小编推荐</i></li>
<li data-tabid=""><i>本周热门</i></li>
</ul>
<ul class="pcontent clearfix tab-con" data-tabnum="">
<li></li>
</ul>
<ul class="pcontent clearfix tab-con" data-tabnum="">
<li></li>
</ul>
<ul class="pcontent clearfix tab-con" data-tabnum="">
<li></li>
</ul>
</div>