Changing the Display Property of some divs

Hi,

I am trying to make some compact error messages, so that they are expandable by clicking the “Show Details” link on the following page:

[url]http://www.ethicalkidnap.co.uk/rabbitweb/amecity/[/url]

As you can see, the problem is, that I have to click the link twice for it to do anything. I know why this is being caused, I just don’t know how to solve it

The script I am using is:

[CODE]function expand(id) {
if (document.getElementById(‘error’+id+’b’).style.display==”none”)
{
document.getElementById(‘error’+id+’e’).innerHTML=”Hide Details”;
document.getElementById(‘error’+id+’h’).style.borderBottom=”0px”;
document.getElementById(‘error’+id+’b’).style.display=”block”;
}
else
{
document.getElementById(‘error’+id+’e’).innerHTML=”Show Details”;
document.getElementById(‘error’+id+’h’).style.borderBottom=”2px solid #FFCC00″;
document.getElementById(‘error’+id+’b’).style.display=”none”;
}
}[/CODE]

The CSS file sets all elements with class “errorbody” to “display: none”. As you can see, the javascript checks to see if ‘error’+id+’b’ is set to that. This is because I want to be able to display numerous errors on the same page, dynamically, so I have given each part of the error message an id containing the number 1, so suggest that it is the first error.

By differentiating between “Show details” and “Show Details” (the capital letter) you can see that it performs the else statement in the javascript first. I can not fill the CSS up with styles for all the errors… there must be another way.

How can I get past this?
Thanks a lot in advance.

-sixfoottallrabbit

EDIT:

Solved by flipping the javascript if…else statement the other way round.

Also in #JavaScript _↴