Dynamically Set CSS Class Of An Element?

I have a menu div that I have styled so that is always visible on my page. When a user clicks a menu item they are taken to that section of that page using an anchor withing the page but the menu remains visible/constant to the left of the screen

My menu is made up of a number of vertically displayed tab images (set by assigning the background image of a href in css), what I would like to happen is that when a user navigates to an anchor section the background image for that section be changed to a 'current tab' image.

Usually this would be done by setting the class of that menu item to "current" within that page, for example if the menu navigated to a seperate about.html page for the about menu item set:

<a href="about.html" id="menu_about" class="current">about<div>
#menu a.current{
background-position:0 -50px;
}

However on my page different pages (eg about.html) wont be loaded so what I would like to be able to do is dynamically set the 'class="current"' for the href element when a user clicks that link.

I tried the following but it didnt work:

<a href="home.html" class="home" id="home" onclick="document.getElementById("home").className="current";"><span class="nav-text">home</span></a>