关于js上拉菜单的有关问题

关于js下拉菜单的问题
问题是：
当点击按钮即a的时候只有最后一个内容即div隐藏了，其他的没有效果是为什么。
附上代码：
window.onload=function(){
var list=getByClass("menu")[0];
varlis=list.childNodes;
vara,div,li,obj;
for(var i=0;i<lis.length;i++){
if(lis[i].tagName=="LI"){
a=firstChild(lis[i]);
div=next(a);
obj={
btn:a,
item:div
};
a.relatedItem=obj;
div.relatedItem=obj;
a.onmouseover=function(){
this.relatedItem.item.style.display="block";
};
div.onmouseout=function(){
this.style.display="none";
};
a.onmouseout=function(evt){
if(evt.relatedTarget==this.relatedItem.item){
return;
};
this.relatedItem.item.style.display="none";
};
};
};
a.onclick=function(){
this.relatedItem.item.style.display="none";
};
};
其中firstChild、next两个函数是指第一个子节点和下一个子节点，都可正常访问。
问题是a.onclick=function(){
this.relatedItem.item.style.display="none";
};
只能是最后一个列表点击是隐藏，前两个无法隐藏。
html结构如下：
<ul class="menu">
<li>
<a href="###">按钮A</a>
<div>内容A</div>
</li>
<li>
<a href="###">按钮B</a>
<div>内容B</div>
</li>
<li>
<a href="###">按钮C</a>
<div>内容C</div>
</li>
</ul>

[解决办法]

JScript code

<ul class="menu"><li><a href="###" onclick="a_click(event);">按钮A</a><div>内容A</div></li><li><a href="###" onclick="a_click(event);">按钮B</a><div>内容B</div></li><li><a href="###" onclick="a_click(event);">按钮C</a><div>内容C</div></li></ul><script>function a_click(event){ var obj = event.srcElement ? event.srcElement : event.target; obj.style.display="none";}</script>
[解决办法]
//【恕直言】需求不明确，html结构凌乱，js不知所谓
JScript code
<ul id="menu">    <li>        <a href="javascript:void(0)">按钮A</a>        <div>内容A</div>    </li>    <li>        <a href="javascript:void(0)">按钮B</a>        <div>内容B</div>    </li>    <li>        <a href="javascript:void(0)">按钮C</a>        <div>内容C</div>    </li></ul><script type="text/javascript">    var ul=document.getElementById("menu");    var li=ul.getElementsByTagName("li");    var div=ul.getElementsByTagName("div");    var a=ul.getElementsByTagName("a");    for(var i=0;i<li.length;i++){        if(i>0)div[i].style.display="none";        a[i].onclick=(function(x){            return function(){                for(var n=0;n<li.length;n++){                    div[n].style.display="none";                }                div[x].style.display="block";            }        })(i)    }</script>