jquery实现点击不同的li,切换到对应的div内容

对应的html代码： 

<ul class="tabItems">
    <li class="active">1</li>
    <li>2</li>
    <li>3</li>
</ul>
<div class="content">
    <div>1</div>
    <div>2</div>
    <div>3</div>
</div>

初始加载页面时，显示第一个li对应的div内容：

  $(window).load(function(){
        $(".contend>div").eq(0).show().siblings().hide();
    });

 点击不同的li,并添加相应的样式和显示对应的div内容，其他同级li，去掉相应的样式和隐藏对应的div内容：

 $(".tabItems>li").click(function () {
        $(this).addClass("active").siblings().removeClass("active");
        var index = $(this).index();
        $(".content>div").eq(index).show().siblings().hide();
    })