Здравствуйте. я - абсолютный нуб, поэтому не судите строго за, наверно, глупый вопрос. Вобщем подобрал я на одном сайте выпадающее меню, подсмотрел его код. Очень простой. В виде таблицы, где высовующиеся элементы - это строчки таблицы, которые по умолчанию скрытые, а при клике отображаются. Сам код выглядит так:

<style>
.hide	{display: none}
.show	{display: block}
</style>
<script>
function setTables(el) {
     	var tables=el.parentNode.getElementsByTagName("TABLE");
     	for (var i=0; i<tables.length; i++) {
     		tables[i].className=(tables[i].className=='hide')?'show':'hide'
     	}
     }
</script>

<table><tr><td>
<a href='javascript:;' onClick='setTables(this);' class='mainmenu'>Меню</a>
<table border=0 width=170 class='hide' cellpadding="0" cellspacing="0" align=left > <tr> <td ><a href='1.html' class='menu' >Пункт1</a></td>        </tr></table></td></tr>

Мне были нужны подменю, и добавил еще строчку, и получилось:

<style>
.hide	{display: none}
.show	{display: block}
</style>
<script>
function setTables(el) {
     	var tables=el.parentNode.getElementsByTagName("TABLE");
     	for (var i=0; i<tables.length; i++) {
     		tables[i].className=(tables[i].className=='hide')?'show':'hide'
     	}
     }
</script>

<table><tr><td>
<a href='javascript:;' onClick='setTables(this);' class='mainmenu'>Меню</a>
<table border=0 width=170 class='hide' cellpadding="0" cellspacing="0" align=left > <tr> <td ><a href='javascript:;' onClick='setTables(this);' class='mainmenu'>Пункт1</a><table border=0 width=170 class='hide' cellpadding="0" cellspacing="0" align=left > <tr> <td ><a href='1.html'>Пункт1.1</a></td></tr></table></td></tr></table></td></tr>

Так вот проблема в том, что подменю открывается во всех браузерах только после второго клика. Будто первый раз onClick не срабатывает, или вызывает не ту функцию. Где я мог ошибится в таком простом коде?