tab切换js

<ul id="navpopid" class="navpop clearfix">
<li class="on">a</li>
<li class="">b</li>
<li class="">c</li>
   </ul>
   <div id="infotab" class="hoteltab">
   <div class="hotelcon" style="display: block;">
1
</div>
<div class="hotelcon" style="display: none;">
2
</div>
<div class="hotelcon" style="display: none;">
3
</div>

</div>

js切换：

$(function(){
contab(".navpop li",".hoteltab .hotelcon");
})
function contab(tab,con){
var com_menu = $(tab),comtabcon = $(con);
comtabcon.eq(0).show();
com_menu.bind("click",function(){
var index = $(this).index();
$(this).addClass("on").siblings().removeClass("on");
comtabcon.eq(index).show().siblings().hide();
});
}

css:

.navpop li.on {
background: #00a6ff;
border-color: #00a6ff;
color: #fff;
}

.navpop li {
float: left;
display: inline;
width: 265px;
border: 1px solid #e6e6e6;
margin-left: -1px;
line-height: 30px;
overflow: hidden;
text-align: center;
font-size: 16px;
cursor: pointer;
}