div onmouseout - reset to a changing class

[mavrick]

Ok I have a simple menu of div tags like this:

<a href="home.html"><div id="home.html" class="leftmenu" onmouseover="this.className='menuover'" onmouseout="this.className='menuout'">Home</div></a>
<a href="about.php"><div id="about.php" class="leftmenu" onmouseover="this.className='menuover'" onmouseout="this.className='menuout'">About</div></a>
etc, etc..

where the 'menuout' class is the same as "leftmenu" - this all works fine.

BUT: now i have added a javascript function like this

function checkActive() {
var div = document.getElementsByTagName("div");
if (window.location.href.substr(location.href.length - 1, 1) == '/') {
var loc = window.location.href + 'home.html';
}
else {
var loc = window.location.href;
}
for(var i=0; i < div.length; i++) {
if (div[i].id == loc) {
div[i].setAttribute("class", "active");
div[i].setAttribute("className", "active");
}
}
}

that finds which div corresponds to the active anchor and changes that div class to "active" which makes the div background a little darker than either of the other classes.

does someone know of an easy way to reset the class onmouseout to whatever it was before, either the default class or the active class? Besides refreshing the page? I can't just use the 'menuout' class anymore because i added the script for active links...

thanks.

[Fang]

Look at how Suckerfish dropdowns JavaScript change the class name.
The class active is added not replacing the existing class.
You get:

<a href="home.html" class="leftmenu">Home</a>
//multiple classes
<a href="home.html" class="leftmenu active">Home</a>

Note that div inside an anchor is invalid, just give the anchor display:block;

[mavrick]

OK thanks. I knew someone was gonna mention the div inside the anchor. I just specified an anchor size and scrapped the div tags. now i can change the background of the area without using divs everything is working fine.