want to have alternate color change for table rows

[s_sameer]

I am using following code which allows me to change bg color of the clicked row, but and i want to change the bgcolor back to original of the previous clicked row

how do i go abt it

Sameer

=====================
<style>
.td1 { background-color: #990000;color : #ffffff; }
.td2 { background-color: #ffffcc;color : #336699; }
</style>

<table width=200 border=1>
<tr id="t1" class=td1 onClick=javascript:callme('t1')><td>some text</td><tr>
<tr id="t2" class=td1 onClick=javascript:callme('t2')><td>some text</td><tr>
<tr id="t3" class=td1 onClick=javascript:callme('t3')><td>some text</td><tr>
<tr id="t4" class=td1 onClick=javascript:callme('t4')><td>some text</td><tr>
</table>

<script language=javascript>
function callme(rno)
{
var tmp = document.getElementById(rno);
tmp.className='td2'
}
</script>

[mattZ]

The easiest way to do this would be to loop through all of the table rows and change each one's class. You should rewrite the function so it looks like this:


function callme(rno) {
for (i=1;i<=4;i++) {
document.getElementById('t'+i).className='td1';
}
var tmp = document.getElementById(rno);
tmp.className='td2';
}

You could do it manually, but looping is easier. (I would also recommend rewriting the XHTML so it meets standards.)