Internet Explorer führt open/close Script falsch aus

[Invisibly85]

Hallo,

ich bin dabei eine hierarchische, baumstrukturartige Navigation zu erstellen. Der folgende (vereinfachte) Code ist das Resultat meiner Datenbankabfrage, doch leider funktioniert er im Internet Explorer nicht wie gewünscht, Opera und Mozilla machen hingegen keine Probleme.

Ich möchte, dass z.B. wie im Windows Explorer, erst einmal nur die oberste Ebene der Listenpunkte zu sehen ist und ein Klick auf einen dieser Listenpunkte den nächsten Unterpunkt öffnet. Das funktioniert soweit auch ganz gut, nur der Internet Explorer macht beim Klicken auf einen Unterpunkt die Liste wieder komplett zu. Mir scheint, als hätte er bei der Unterscheidung zwischen ID "1" und "11" oder "2" und "22" Probleme, oder aber die Ebenen überlagern sich.. ?!?

Bin echt ratlos. Ich muss dazu sagen, dass ich mit Listen erst sehr kurz arbeite.

<script type="text/javascript">  
function openclose(field)  
{  
  
if(document.getElementById(field).style.display == "block")  
{  
document.getElementById(field).style.display = "none";  
}  
else  
{  
document.getElementById(field).style.display = "block";  
}  
  
}  
</script>

  
<ul id='0' style='display:block; cursor:pointer;'>  
  <li onClick=openclose('1');>Test 1</li>  
	<ul id='1' style='display:none; cursor:pointer;'>  
    <li onClick=openclose('11');>Test 1.1</li>  
	  <ul id='11' style='display:none; cursor:pointer;'>  
      <li onClick=openclose('111');>Test 1.1.1</li>  
      <li onClick=openclose('113');>Test 1.1.3</li>  
		<ul id='113' style='display:none; cursor:pointer;'>  
        <li onClick=openclose('1131');>Test 1.1.3.1</li>  
        </ul>  
	  </ul>  
	</ul>  
  <li onClick=openclose('2');>Test 2</li>  
	<ul id='2' style='display:none; cursor:pointer;'>  
    <li onClick=openclose('21');>Test 2.1</li>  
    <li onClick=openclose('22');>Test 2.2</li>  
	  <ul id='22' style='display:none; cursor:pointer;'>  
      <li onClick=openclose('221');>Test 2.2.1</li>  
	    <ul id='221' style='display:none; cursor:pointer;'>  
        <li onClick=openclose('2211');>Test 2.2.1.1</li>  
        </ul>  
      </ul>  
    </ul>  
  <li onClick=openclose('3');>Test 3</li>  
	<ul id='3' style='display:none; cursor:pointer;'>  
    <li onClick=openclose('31');>Test 3.1</li>  
    </ul>  
  <li onClick=openclose('4');>Test 4</li>  
</ul>  
  

Ich hoffe ihr könnt mir weiterhelfen! Vielen Dank für eure Hilfe!

Grüße

Basti