Double click needed to switch CSS prop

[japangreg]

Hey, everyone. I have a script to change the CSS display property of a div; so far, everything works fine except that I have to click twice on the "expand" button to get the property to switch. Any ideas of why this might be happening? Code is below.

function toggle(id){
if (document.getElementById(id).style.display == "none"){
document.getElementById(id).style.display = "block";
}else{
document.getElementById(id).style.display = "none";
}
}

The CSS I am using is as follows:

.expandButton{text-decoration:underline;
cursor : pointer;
}
#subMenu{display:none;
}

The code in the body looks like this:

<span class="expandButton" onClick="toggle('subMenu')">Expand</span>
<div id="subMenu">
Sub Menu is here
</div>

Any help is appreciated! :thumbsup:

Thanks!
japangreg

[EDIT]*PROBLEM SOLVED*
I just switched the conditionals and now it works like a dream. So now instead of: if (document.getElementById(id).style.display == "none"){
document.getElementById(id).style.display = "block";
}else{
document.getElementById(id).style.display = "none";
}
I have:if (document.getElementById(id).style.display == "block"){
document.getElementById(id).style.display = "none";
}else{
document.getElementById(id).style.display = "block";
Thanks to all who took the time to read this!
[EDIT]

[beetle]

Glad you got it figured out. You many want to take a gander at my post in this thread (http://www.codingforums.com/showthread.php?s=&threadid=8645). The function there is a result of my trial & error on various browsers in various situations.

[japangreg]

Hey, Beetle, thanks for the thread. Tackling the browser issue is my next step... one that I hate and am not very good at. Your code should come in handy in figuring out the next step! :)

Thanks!
japangreg