DOM Question

[Piggy79]

hey trying to make a script so when i click on a certain link it will hide a "ul" element then make it reappear. Now im really really really close. but i got one issue. I can make the link itself dissapear but it will not let me reference the ul element. here is the html so u can get an idea of the dom structure.



<div id="menu">
<p><a href="#" >Section One</a></p>
<ul>
<li><a href="#">section one part i</a></li>
<li><a href="section001.htm">section one part ii</a></li>
</ul>
</div>

here is all the javascript. The issue is with the function "mouseGoesDown"


var W3CDOM = (document.createElement && document.getElementsByTagName);

window.onload = init;

function init()
{


if (!W3CDOM) return;
var nav = document.getElementById('menu');
var sections = nav.getElementsByTagName('p');

for (var i=0;i<sections.length;i++)
{
sections[i].firstChild.onclick = mouseGoesDown;
}
}


function mouseGoesDown()
{

var nextSibStatus = (this.parentNode.nextSibling.style.display == 'none') ? 'block' : 'none';
this.parentNode.nextSibling.style.display = nextSibStatus;
this.style.border = ('1px #666 solid');
this.style.backgroundColor = '#888';
this.style.color = '#552278';
return false;
}


Now if i change "this.parentNode.nextSibling.." to just "this.parentNode" the actual paragraph will be hidden so i know im at the paragraph so the ul element should be the nextSibling but i get nothing...

Any help with this would be fantastic. Been trying to wrap my head around it but im just lost as to why nextSibling will not work.

[Piggy79]

well figured it out when i did nextSibling it referenced a text node i just had to add a second nextSibling. so its this.parentNode.nextSibling.nextSibling

[zanzinato]

This doesn't necessarily help with your issue directly, but this is an awesome book about the DOM.

http://www.domscripting.com/book