jquery切换div，打开关闭按钮

一、点击标题，隐藏显示div并添加删除样式

 <ul class="character">
             <li id="tanke"><a href="#tanke">坦克</a></li>
             <li id="zhanshi"><a href="#zhanshi">战士</a></li>
             <li id="fashi"><a href="#fashi">法师</a></li>
             <li id="cike"><a href="#cike">刺客</a></li>
             <li id="sheshou"><a href="#sheshou">射手</a></li>
             <li id="fuzhu"><a href="#fuzhu">辅助</a></li>
  </ul>

                     <ul class="skinall" id="tanke1"><li></li></ul>

                     <ul class="skinall" id="tanke1"><li></li></ul>

                     <ul class="skinall" id="zhanshi1"><li></li>

                    </ul>......

<script type="text/javascript">
    $(function () {
        //默认显示第一个元素
        /*$(".skinall").hide();*/
        $(".skinall").eq(0).show();
        $("#tanke a").addClass("jq");
    });

    $(".character li").each(function () {
        $(this).click(function () {

            $(".skinall").eq($(this).index()).show();
            $(".skinall").eq($(this).index()).siblings().hide();
            $(this).parent().css("display", "block");
            $(".timedis").css("display", "block");
            $(this).find("a").addClass("jq");
            $(this).siblings().find("a").removeClass("jq");

        });
    });
</script>

二、点击不同的按钮打开关闭块

<i class="jun"></i>
<i class="xx"></i>
<div class="right">
    <ul class="jun1">
        <li class="login"><a href="login2.html"><span>登录</span></a></li>
        <li class="register"><a href="register2.html"><span>注册</span></a></li>
    </ul>
</div>

<script type="text/javascript"> 

$(".jun").click(function () {
    $(".right").slideDown();
    $(".jun").css("display", "none");
    $(".xx").css("display", "block");
});
$(".xx").click(function () {
    $(".right").slideUp();
    $(".xx").css("display", "none");
    $(".jun").css("display", "block");
});

</script>