change classname in <li> tag?

[raindogs]

This should be simple, but it's driving me nuts. All I want to do is assign a class to a list item based on the current URL. Here's my list in the HTML page:

<ul>
<li id="home"><a href="index.html">Home</a></li>
<li id="maintenance"><a href="maintenance.html">Maintenance</a></li>
<li id="reports"><a href="reports.html">Reports</a></li>
<li id="invoices"><a href="invoices.html">Invoices</a></li>
<li id="staff"><a href="staff.html">Staff</a></li>
</ul>

I have a class called "current" defined in my style sheet that I want to apply to whichever item applies to the current page. I thought this JavaScript would do it (note that this href string is using an absolute URL, which I will change once it's off the test server):

var strHref = window.location.href;
if(strHref == '

http://nv15/maintenance.html'){

document.getElementById('maintenance').className = 'current';
} else {
document.getElementById('home').className = 'current';
}

This never changes the class of the list item and produces a JavaScript error that reads:
document.getElementById("home") has no properties

Can anyone help me out?

Thanks,
Alex

 

[cLFlaVA]

where are you calling this script? if the page hasn't fully rendered, this could be the cause of the problem. try putting your code at the bottom of your page, or within a function, and call the function from the body's onload event.



*cLFlaVA
----------------------------
[tt]( <P> <B>)[sup]13[/sup] * (<P> <.</B>)[/tt]

[URL unfurl="true"]http://www.coryarthus.com/[/url]

 

[raindogs]

Thanks a lot, that did turn out to be the problem.