用ul标签做树形菜单

<script type="text/javascript">
function show(index){
var elem=document.getElementById('caidan'+index);
if(elem.style.display=='none')
elem.style.display='block';
else
  elem.style.display='none';
} 
</script>

<script type="text/javascript">
   
//如果参数存在则显示所选条件 
function search(index,id){
var obj = document.getElementById("down"); 
var tablename=index;
obj.src=index+"search?&tablename="+index;       
//   alert(id); 
$('#li'+id).css({'background-color':'#53c2e8'});
}
</script>

<ul  >

<li>
<a  href="javascript:show(1);" >其他表单</a>
<ul  class="caidanlist1" style="display:none" id="caidan1">
 <s:iterator value="userright" var="val" status="st">

 <li  id="li<s:property value='#st.count'/>"  onclick="search('<s:property value="val"/>','<s:property value='#st.count'/>');"> 

<s:property value="val"/>   

                                                           </li>

 </s:iterator>
</ul>
</li>
<li>
<a  href="javascript:show(2);" >测试项</a>
<ul  class="caidanlist2" style="display:none" id="caidan2">
 <li>苹果</li>
 <li>香蕉</li>
 <li>橘子</li>
</ul>
</li>

</ul>