求javascript/如何控制多个div层显示与隐藏，万分感谢

Question

想做如下效果出来：
<div id="center">
<div id="left">
<ul>
<li><a href="#">链接一</a></li>
<li><a href="#">链接二</a></li>
<li><a href="#">链接三</a></li>
<li><a href="#">链接四</a></li>

</ul>
</div>
<div id="right">
<div class="a"></div>
<div class="b"></div>
<div class="c"></div>
<div class="d"></div>
</div>
</div>
我想点击左边的链接一显示右边的.a容器内容，其它隐藏。
点击二显示b容器的内容，其它隐藏，注意，这只是随便写点代码，假如左边有十个，或更多的超链接时，用javascript哪种方法更方便？本人刚入门，请各位大哥路过帮手。谢谢！！！！
帮忙附个简单的代码

Answer 1

<script>
function showContent(num)
{
for(var i=0;i<right.children.length;i++)
{
right.children(i).style.display="none";
}
right.children(num).style.display="";
}
</script>
<div id="center">
<div id="left">
<ul>
<li><a href="#" onclick="showContent(0)">链接一</a></li>
<li><a href="#" onclick="showContent(1)">链接二</a></li>
<li><a href="#" onclick="showContent(2)">链接三</a></li>
<li><a href="#" onclick="showContent(3)">链接四</a></li>

</ul>
</div>
<div id="right" style="width:200;height:100;background-color:#abcdef">
<div class="a" style="display:none">一的内容</div>
<div class="b" style="display:none">二的内容</div>
<div class="c" style="display:none">三的内容</div>
<div class="d" style="display:none">四的内容</div>
</div>
</div>本回答被提问者采纳

Answer 2

你给div去一样的名字

用var divs=getElementByNames()获取

遍历divs，把他们都隐藏，你要显示的div除外（用if判断下）