[SOLVED] Javascript to change link colour

[idire]

What I currently have is code to show one Div and hide the rest when I click on a link

 

What I want to do is have the link I click on change colour to RED to confirm thats the div currently being displayed. and change the other links back to black.

 

I think the code will go next to this: layer.style.display = "none"; but i dont know what the code is. I'd also like to remove text decoration from the links apart from those colours.

 

<SCRIPT type="text/javascript">
states=new Array()
states[0]="a"
states[1]="b"
states[2]="c"
states[3]="d"
states[4]="e"
states[5]="f"
states[6]="g"
states[7]="h"

function hideAllExcept(elm) {
for (var i = 0; i < states.length; i++) {
	var layer = document.getElementById(states[i]);
	if (elm!= states[i]) {
		layer.style.display = "none";
	}
	else {
		layer.style.display = "block";
	}
}
}
</SCRIPT>

 

and the html:

 

<A HREF="#" onclick="hideAllExcept('a');">link1</A>
<A HREF="#" onclick="hideAllExcept('b');">link2</A>
<A HREF="#" onclick="hideAllExcept('c');">link3</A>
<A HREF="#" onclick="hideAllExcept('d');">link4</A>
<A HREF="#" onclick="hideAllExcept('e');">link5</A>
<A HREF="#" onclick="hideAllExcept('f');">link6</A>
<A HREF="#" onclick="hideAllExcept('g');">link7</A>
<A HREF="#" onclick="hideAllExcept('h');">link8</A>

 

and the divs:

 

<div id="a" style="display:block">div a data</div>

<div id="b" style="display:none">divb data</div>

<div id="c" style="display:none">divc data</div>

<div id="d" style="display:none">divd data</div>

<div id="e" style="display:none">dive data</div>

<div id="f" style="display:none">divf data</div>

<div id="g" style="display:none">divg data</div>

<div id="h" style="display:none">divh data</div>

[idire]

not had any luck with this yet, tried adding classes to the links but that made the div switching break

 

changes:

 

<style>
#nodec a {
text-decoration:none;
color:#000000;
}
</style>

<div id="nodec">
<A HREF="#" onclick="hideAllExcept('a');"><span class="a" style="color:#FF0000">link1</span></A>
<A HREF="#" onclick="hideAllExcept('b');"><span class="b" style="color:#000000">link2</span></A>
<A HREF="#" onclick="hideAllExcept('c');"><span class="c" style="color:#000000">link3</span></A>
<A HREF="#" onclick="hideAllExcept('d');"><span class="d" style="color:#000000">link4</span></A>
<A HREF="#" onclick="hideAllExcept('e');"><span class="e" style="color:#000000">link5</span></A>
<A HREF="#" onclick="hideAllExcept('f');"><span class="f" style="color:#000000">link6</span></A>
<A HREF="#" onclick="hideAllExcept('g');"><span class="g" style="color:#000000">link7</span></A>
<A HREF="#" onclick="hideAllExcept('h');"><span class="h" style="color:#000000">link8</span></A>
</div>

 

What I need to be able to do is change the colour on the clicked link to red, and all the other colours to black.

 

Should be a way of doing it using the function above, i just dont know how.

[idire]

solved elsewhere, thanks