Alter class with JS... How to...

[Conspiracy]

Ok, I have this script here:

var temp;
function abrediv(id){

if(temp != undefined){
if( document.getElementById("div_"+id).style.display == "none"){
// +
document.getElementById("div_"+temp).style.display = "none";
document.getElementById("img_"+temp).src = "img/plus.jpg";

// -
document.getElementById("div_"+id).style.display = "block";
document.getElementById("img_"+id).src = "img/minus.jpg";


And in the html, it is used like this:


<a href="javascript:abrediv('1');" class="menuItem_0"><img id="img_1" src="img/plus.jpg" width="9" height="9" border="0">&nbsp;&nbsp;Menu Item</a>

Now, the script only changes the image and the display (block or none), now how can I add a class change? Like when the display is set to block, assign one class to the anchor and when is set to none, assign a different one?

I'm not big in js, that is why I need help, actually not big would be an understatement, I'm terrible....

Thanks anyway....

[Raffles]

var temp;
function abrediv(id){
  if (temp != undefined){
    if (document.getElementById("div_"+id).style.display == "none") {
      document.getElementById("div_"+temp).style.display = "none";
      document.getElementById("img_"+temp).src = "img/plus.jpg";
      document.getElementById("div_"+id).style.display = "block";
      document.getElementById("img_"+id).src = "img/minus.jpg";
      document.getElementById("a_"+id).className = "newclass";
    }
  }
}

In your HTML:

<a href="#" class="menuItem_0" id="a_1" onclick="abrediv('1');"><img id="img_1" src="img/plus.jpg" width="9" height="9" border="0">&nbsp;&nbsp;Menu Item</a>

Also, you should give the height and width of your img with units (px most likely). Or don't do it at all, the browser can see what size it is, unless you're resizing it from its original size.