jq实现tab选项卡

<div class="tab">
        <ul class="tab-title">
          <li class="this">网站设置</li>
          <li>用户管理</li>
          <li>权限分配</li>
          <li>商品管理</li>
          <li>订单管理</li>
        </ul>
        <div class="tab-content">
          <div class="tab-item show">内容1</div>
          <div class="tab-item">内容2</div>
          <div class="tab-item">内容3</div>
          <div class="tab-item">内容4</div>
          <div class="tab-item">内容5</div>
        </div>
      </div>

<script>
   $('.tab-title li').on('click',function(){
       $(this).addClass('this').siblings().removeClass("this");;
       var index = $(this).index();
       //siblings() 同级，同胞元素
       //parent() 获得当前匹配元素的父元素
　　　　$(this).parent().siblings().children().eq(index).addClass("show")
　　　　.siblings().removeClass("show");
       
   })
</script>