title: How to remake the menu to be toggle
body: <p>I have this script for my Vertical Menu:</p>
  
  <pre><code>&lt;script type="text/javascript"  
  var menuids=["sidebarmenu1"]    
  function initsidebarmenu(){
  for (var i=0; i&lt;menuids.length; i++){
  var ultags=document.getElementById(menuids[i]).getElementsByTagName("ul")
  for (var t=0; t&lt;ultags.length; t++){
  ultags[t].parentNode.getElementsByTagName("a")[0].className+=" subfolderstyle"
  if (ultags[t].parentNode.parentNode.id==menuids[i]) 
  ultags[t].style.left=ultags[t].parentNode.offsetWidth+"px" //dynamically position first level submenus to be width of main menu item
  else //else if this is a sub level submenu (ul)
  ultags[t].style.left=ultags[t-1].getElementsByTagName("a")[0].offsetWidth+"px" //position menu to the right of menu item that activated it
  ultags[t].parentNode.onmouseover=function(){
  this.getElementsByTagName("ul")[0].style.display="block"
  }
  ultags[t].parentNode.onmouseout=function(){
  this.getElementsByTagName("ul")[0].style.display="none"
  }
  }
  for (var t=ultags.length-1; t&gt;-1; t--){
  ultags[t].style.visibility="visible"
  ultags[t].style.display="none"
  }
  }
  }
  if (window.addEventListener)
  window.addEventListener("load", initsidebarmenu, false)
  else if (window.attachEvent)
  window.attachEvent("onload", initsidebarmenu)
  
  &lt;/script&gt;
  </code></pre>
  
  <p>Where can I use onclick event to make it toggle, like when I press the first time it appears and when I press the second time it disappears and so on... ?</p>