js实现点击切换。不跳转

如何点击切换？Js实现点击切换

我这里有一个写法大家可以直接拿过去用

不过css部分需要自己写

点击切换代码，首先需要引入jq

  <!-- two -->    

 <div class="ui-news">   

<div class="ui-news-tab">

<div class="ui-md  activea "  > 

<a href="JavaScript:;" class="ui-tab " >头条</a>

 </div> 

<div class=" ui-md"> 

  <a href="JavaScript:;" class="ui-tab" >热点</a>

</div> 

<div class="ui-md"> 

 <a href="JavaScript:;" class="ui-tab" >推荐</a>  

</div> 

 </div>    

<div class="ui-news-list">  

 <div class="ui-md-list on">   

       <div class="Push-title"><a href="">新的肥肉公开欸额我饿</a></div>

       <div class="Push-title"><a href="">新闻新闻新闻新闻新闻</a></div>

       <div class="Push-title"><a href="">新闻新闻新闻新闻新闻</a></div>          

       <div class="Push-title"><a href="">新闻新闻新闻新闻新闻</a></div>

       <div class="Push-title"><a href="">新闻新闻新闻新闻新闻</a></div>

       <div class="Push-title"><a href="">新闻新闻新闻新闻新闻</a></div>           

</div>  

 <div class="ui-md-list">   

       <div class="Push-title"><a href="">第三个发帖回帖富含天</a></div>

       <div class="Push-title"><a href="">新闻新闻新闻新闻新闻</a></div>

       <div class="Push-title"><a href="">新闻新闻新闻新闻新闻</a></div>          

       <div class="Push-title"><a href="">新闻新闻新闻新闻新闻</a></div>

       <div class="Push-title"><a href="">新闻新闻新闻新闻新闻</a></div>

       <div class="Push-title"><a href="">新闻新闻新闻新闻新闻</a></div>            

</div>  

<div class="ui-md-list">   

       <div class="Push-title"><a href="">但是规范化反弹格局更</a></div>

       <div class="Push-title"><a href="">新闻新闻新闻新闻新闻</a></div>

       <div class="Push-title"><a href="">新闻新闻新闻新闻新闻4</a></div>          

       <div class="Push-title"><a href="">新闻新闻新闻新闻新闻</a></div>

       <div class="Push-title"><a href="">新闻新闻新闻新闻新闻</a></div>

       <div class="Push-title"><a href="">新闻新闻新闻新闻新闻</a></div>           

</div>  

 </div>  

   <script>

 var hd_li = $(".ui-md");

hd_li.click(function () {

    $(this).addClass("activea").siblings().removeClass("activea");

    var index = hd_li.index(this);

    $(".ui-md-list").eq(index).addClass("on").siblings().removeClass("on");

});  

  </script>

 </div>      

<!-- two -->