change a row class, with radio button onClick?

[andy100]

Each row has a radio button in it.
I need some code which will change a row's class name when the radio button in that row is clicked.

Basically, i want the row to appear higlighted when it's radio button is clicked.

The code below works very well for checkboxes, but will not swap swap deselected rows back.

ie...

<style>
.OffCels {background-color: #EEEEEE}
.OnCels {background-color: #CCCCCC}
</style>

<script>
function changeit(obj)
{
EL=obj.value;
document.getElementById(EL).className= (obj.checked) ? 'OnCels' : 'OffCels';
}
</script>

<tr id="row1"><td>
<input type="checkbox" name="checkboxbutton" value="row1" onClick="changeit(this)">
</td><td>row content here</td><tr>

<tr id="row2"><td>
<input type="checkbox" name="checkboxbutton" value="row2" onClick="changeit(this)">
</td><td>row content here</td><tr>

thanks in advance,
Andy

[beetle]

Well, this works<table>
<tr id="row1" class="OffCels"><td>
<input type="radio" name="checkboxbutton" value="row1" onClick="changeit(this)" onpropertychange="changeit(this)">
</td><td>row content here</td><tr>

<tr id="row2" class="OffCels"><td>
<input type="radio" name="checkboxbutton" value="row2" onClick="changeit(this)" onpropertychange="changeit(this)">
</td><td>row content here</td><tr>
</table>But onpropertychange is an IE-only event. I'm looking at DOM-approved events right now to see if anything will be cross-browser.

Is there a fixed number of rows here? Or is it variable?

[andy100]

thanks for the reply, it will probably be fixed for now...