I am building a Hierarchical Menu structure.  Each menu table is surronded 
by <div> tags with a unique id which represents the menu.  Each <td> tag 
(menu selection) passes the next menu name using the onclick object to 
execute a function showMenu(menuname). (This menu has evolved from the 
menu example taken from the Wrox Beginning JavaScript)

This works fine. However, I am trying to close the previous menu by 
determining menu based on the the menu name being passed to the function.

For example:
***menu***

<div id=menu1><tr><td onclick="showMenu(menu1_1)">menu1_1</td></tr></div>

fuction showMenu(menutoshow)
{
   var parentmenu = menutoshow.id //this gives me menu1_1
   parentmenu = parentmenu.substring(0,parentmenu.lastIndexOf("_"));
   //this gives me menu1. The menu I want to close.
   //next I try to change the style.left and style.top but get an error
   // parentmenu.style is not an object. below is the code.

   parentmenu.style.left = -100px
   parentmenu.style.top =  -20px

   //then the rest of the function that works.
   menutoshow.style.left = 40px
   menutoshow.style.top  = 200px
  }

How can I get the new variable 'parentmenu' to represent the div id object 
menu1. Right now it appears to be only a string value and returns an error.

For example:

If I hard code a variable ie. var parentmenu = "menu1"; this returns the 
same error. However, var parentmenu = menu1; works.

Thanks in advance for any help in resolving this issue.  I am not sure if 
I am missing something simple or approaching the problem in the wrong way.

ydean5