Mostrar/ocultar varias columnas de una tabla a la vez pulsando sólo un enlace

[cqg2509]

Hola a todos.
Tengo una duda que a ver si me la podéis solucionar.
Necesito hacer un menú en una tabla, en el que haya unas columnas (Tr) ocultas y al hacer click en la columna de arriba se muestren. Es como un submenú dentro de la tabla. A ver si con esta imagen lo ven mejor:

Al hacer click en la celda Menú 1 se muestran las columnas Menú 1.1, Menú 1.2 y Menú 1.3. Las 3 a la vez, sólo con hacer click en la celda Menú 1.
Os pongo lo que tengo y a ver si lo solucionamos:
HTML

Código:

<TABLE BORDER="1" WIDTH="100px">
<TR><TD ONCLICK="Mostrar(menuoculto)">Menú 1</TD></TR>
<TR ID="menuoculto" STYLE="display:none;"><TD> - Menú 1.1</TD></TR>
<TR ID="menuoculto" STYLE="display:none;"><TD> - Menú 1.2</TD></TR>
<TR ID="menuoculto" STYLE="display:none;"><TD> - Menú 1.3</TD></TR>
<TR><TD>Menú 2</TD></TR>
<TR><TD>Menú 3</TD></TR>
<TR><TD>Menú 4</TD></TR>
</TABLE>

JavaScript

Código:

function Mostrar(Div)
	{
	if (Div.style.display == "none")
		{
		Div.style.display = ""
		}
	else
		{
		Div.style.display = "none"
		}
	}

Según he leído en otros temas el problema está en que las columnas que están ocultas y que quiero mostrar tienen el mismo id. Creo que los ids que quiero mostrar tengo que renombrarlos así: menu1.1, menu1.2 y menu1.3. Luego hay que hacer un bucle con un contador en el código JavaScript y concatenarlo con los id que quiero mostrar. Pero antes necesito obtener con el document.getElementById(id) el id pero no se como se hace...
Saludos!

[ZiTAL]

ID es único para cada elemento, no se pueden repetir, de todas formas estás enfocando mal, ya que no debería ser una tabla sino una lista ( ul -> li):

Código HTML:

<ul id="menu1">
<li>menú 1.1</li>
<li>menú 1.2</li>
</ul>
 

así al ocultar el UL no se verán sus hijos (LI-s)

[cqg2509]

Hola ZiTAL,
entiendo lo que dices pero no es lo que busco, ya que necesito que esté todo enmarcado dentro de celdas, cambiando lo que dije de JavaScript.
Gracias de todas formas.