实现div切换

js代码：  .switchD为页面上的点击事件触发元素

$(document).ready(function(){
    $(".switchD").click(function(){
        var sIndex = $(this).index()+1;
        var switchId = $($(this).parent()).attr("id");
        var switchParentId = "#" + switchId + "Show" ;
        var switchDivArray = $(switchParentId).children();
        for(var i=1;i<switchDivArray.length+1;i++){
            $(switchParentId+" "+"div:nth-child("+i+")").css("display","none");
        }
        $(switchParentId+" "+"div:nth-child("+sIndex+")").css("display","block");   
    })
});

css:

.switchDiv div{
    display: none;
}

html: 切换的展示DIV和点击的DIV 之间的 ID 关系为 A = A + "Show"；

    <div id="parentDiv">
        <li class="switchD">第1个div</li>
        <li class="switchD">第2个div</li>
        <li class="switchD">第3个div</li>
        <li class="switchD">第4个div</li>
    </div>
    <div id="parentDivShow" class="switchDiv">
        <div id="switchDiv1">我是第1个div</div>
        <div>我是第2个div</div>
        <div>我是第3个div</div>
        <div>我是第4个div</div>
    </div>