类似QQ日志分类管理界面如何制作？？请教高手！！！！急急急！！！

以下是我的代码，想要达到的效果如：假如点击“一级菜单”后面的“添加”则自动在“二级菜单”处增加相应的二级菜单；点击“修改”则该“一级菜单”动态可以任意修改，点击“删除”则将该“一级菜单”以及其附属的二级，三级菜单，均删除。 以此类推！  
<dl id="menu" >
   <dt ><a style="display:inline;float:left;width:85%;" href="javascript:void(0)">+ 一级菜单</a></dt>    
<a style="float:left;"href="#" onclick="add()">添加</a>    
        <a style="float:left;"href="#">删除</a>     
        <a style="float:left;"href="#">修改</a>
   <dd>  
      <h2><a style="display:inline;float:left;width:85%;" href="javascript:void(0)">+ 二级菜单</a></h2>
 <a style="float:left;"href="#" onclick="add()">添加</a>    
 <a style="float:left;"href="#">删除</a>     
 <a style="float:left;"href="#">修改</a> <ul>
  <a style="display:inline;float:left;width:870px;"href="javascript:void(0)">三级菜单</a>
  <a style="float:left;"href="#">添加</a>    
  <a style="float:left;"href="#">删除</a>     
  <a style="float:left;"href="#">修改</a>
         </ul><script language="JavaScript">
<!--//
function $Id(Id){return document.getElementById(Id);}
function $Tag(id,Tag){return id.getElementsByTagName(Tag);}
function ShowMenu(e){
var $dt = $Tag($Id(e),"dt");
var $dd = $Tag($Id(e),"dd");
$dd[0].style.display = "block";
for(var t=0;t<$dt.length;t++){
$dt[t].value=t;
$dt[t].onclick = function(){return ShowClose(this,this.value);}
var $h2 = $Tag($dd[t],"h2");
for(var h=0;h<$h2.length;h++){
$h2[h].value=h;
$h2[h].onclick = function(){return ShowClose(this,this.value);}
}
}
function ShowClose(obj,n){
var dt = $Tag(obj.parentNode,obj.tagName);
var dd = $Tag(obj.parentNode,[obj.parentNode.tagName!="DL"?"ul":"dd"]);
if(dd.length==0 || !dd[n]){return false;}
if(dd[n].style.display == "block"){
obj.className = "";
obj.innerHTML = obj.innerHTML.replace("-","+");
dd[n].style.display = "none";
return false;
}
for(var i=0;i<dt.length;i++){
dt[i].innerHTML=[i!=n?dt[i].innerHTML.replace("-","+"):dt[i].innerHTML.replace("+","-")];
dt[i].className=[i!=n?"":"off"];
}
for(var i=0;i<dd.length;i++){dd[i].style.display=[i!=n?"none":"block"];}
}
}
new ShowMenu( "menu");
//-->
</script>