[evuseem]

I have a javascript code written as:

 function change_it(itemID){
      // Toggle visibility between none and inline
      if ((document.getElementById(itemID).style.display == 'none'))
      {
        document.getElementById(itemID).style.display = 'inline';
      } else {
        document.getElementById(itemID).style.display = 'none';
      }
  }
  
  function close_it(itemID){
    document.getElementById(itemID).style.display = 'none';
  }

And I have like say 5 menu items (menu1, menu2, menu3, menu4,menu5)

On click of a particular menu, i want the table displayed, relevant to that menu and hide the others. To do this I have called the javascript as follows:

example:

<table id="menu_tbl" cellpadding=5 style="display:none;" size=10>
   <tr>
   <td><a href="#h" onClick="change_it('menu1') & close_it('menu2') & close_it('menu3') & close_it('menu4') & close_it('menu5')">menu1</a></td>
   <td><a href="#e" onClick="change_it('menu2') & close_it('menu1') & close_it('menu3') & close_it('menu4') & close_it('menu5')">menu2</td>
   </td>
               .....

As you see, more the menu's the longer gets the onClick line .. I am wondering if there is a better way of doing this

Thank you,
Evu