jq 选项卡

html:

<div class="bossreadContent">

                <div class="nav-ul">

                    <ul class="clearifix">

                        <li class="active"><a href="javascript:;">tab1</a></li>

                        <li class=""><a href="javascript:;">tab2</a></li>

                    </ul>

                </div>

                <div class="list-wrapper">

                    <!-- tab1 -->

                    <div class="item-cont" style="display: block;">

                        <div class="works-body clearfix">

                            <div class="works-item fl">

                                <a href="#" target="_blank" class=" clearfix">

                                    <div class="works-img fl"><img src="./images/bill_img.png" alt=""></div>

                                    <div class="works-info fl">

                                        <p class="comment-txt">某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某。</p>

                                    </div>

                                </a>

                            </div>

                        </div>

                    </div>

                    <!--tab2 -->

                    <div class="item-cont" style="display: none;">

                        <div class="enroll-body clearfix">

                              <div class="enroll-item fl">                     

               <p class="comment-txt">某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某某。</p>

                        </div>

                    </div>

                </div>

            </div>

jq:

   $('.nav-ul ul>li').click(function(){

            var index_n = $(this).index();

            $(this).addClass('active').siblings().removeClass('active');

            $('.item-cont').eq(index_n).show().siblings().hide();

        })