【提问】新手求教育JS的问题

$(function(){
var $div_li =$("div.mid_4_title ul li");
$div_li.click(function(){
$(this).addClass("mid_4_selected")
.siblings().removeClass("mid_4_selected");
var index = $div_li.index(this);
$("div.mid_4_content > div")
.eq(index).show()
.siblings().hide();
}).hover(function(){
$(this).addClass("hover");
},function(){
$(this).removeClass("hover");
})
var $div_li =$("div.int_li ul li");
$div_li.click(function(){
$(this).addClass("int_li_sty")
.siblings().removeClass("int_li_sty");
var index = $div_li.index(this);
$("div.int_table_word > div")
.eq(index).show()
.siblings().hide();
})
var $div_li =$("div.pali ul li");
$div_li.click(function(){
$(this).addClass("Pselected")
.siblings().removeClass("Pselected");
var index = $div_li.index(this);
$("div.pa_show > div")
.eq(index).show()
.siblings().hide();
}).hover(function(){
$(this).addClass("pahover");
},function(){
$(this).removeClass("pahover");
})
var $div_li =$("div.center_main ul li");
$div_li.click(function(){
$(this).addClass("censelected")
.siblings().removeClass("censelected");
var index = $div_li.index(this);
$("div.center_content > div")
.eq(index).show()
.siblings().hide();
}).hover(function(){
$(this).addClass("cenhover");
},function(){
$(this).removeClass("cenhover");
})
});
上面这段代码是我给网站几个页面写的静态页面跳转，把其他的都注释掉只运行一段就能有效果，但是不注释的话，只有最后一段能有效果，前面三段都没有用，请问怎么回事啊？！有大牛教下吗？