CSS style based on checkbox checked/unchecked

I have a table with an indefinate number of rows set up similar to the following:

[CODE]<form name=”form1″>
<table>
<tr>
<td>name</td>
<td>check/uncheck all
<input type=”checkbox” name=”checkbox” value=”checkbox”> </td>
</tr>
<tr class=”normal”>
<td>Joe</td>
<td><input type=”checkbox” name=”checkbox0″ value=”checkbox”></td>
</tr>
<tr class=”normal”>
<td>Bob</td>
<td><input type=”checkbox” name=”checkbox1″ value=”checkbox”></td>
</tr>
</table>
</form>[/CODE]

The class “normal” is black text/white background
The class “inverted is white text/black background

What I am looking for is a way to change the class from “normal” to “inverted” when the checkbox within that row is checked. (when checked: class=”inverted” ; when unchecked: class=”normal”)

This could be done easily enough if the only way to check/uncheck a checkbox was to click on it. But I also use a javascript which checks/unchecks all checkboxes.

Is there a way to make the class reflect the value of the checkbox without having to click on the individual boxes?

Thank you ?

Also in #JavaScript _↴