下拉式Tab

.has_children{
background:#555;
color:#FF0000;
cursor:pointer;

}
div{
padding:0;
margin:0px 0;
}
div a{
background:#888;
display:none;
float:left;
width:300px;
}
.highlight{
color:#FF00FF;
background:#cccccc;
}

$(".has_children").click(function(){
			$(this).addClass("highlight")
				.children("a").show().end()
				.siblings().removeClass("highlight")
				.children("a").hide();
		})

<div id="menu">
		<div id="content" class="has_children">
			 <span>第一章</span>
			 <a>链接11</a>
			 <a>链接12</a>
			 <a>链接13</a>
			 <a>链接14</a>
			 <a>链接15</a>
		</div>
		<div id="content" class="has_children">
			 <span>第2章</span>
			 <a>链接21</a>
			 <a>链接22</a>
			 <a>链接23</a>
			 <a>链接24</a>
			 <a>链接25</a>
		</div>
		<div id="content" class="has_children">
			 <span>第3章</span>
			 <a>链接31</a>
			 <a>链接32</a>
			 <a>链接33</a>
			 <a>链接34</a>
			 <a>链接35</a>
		</div>
	</div>