Hi,

I have this code that makes the td cells change color when moused over, then changes 1 to a different color when clicked, then changes it back when mosued out. I would like the last cell clicked to stay on blue3 until another is clicked, and the rest of the cells to continue changing when moused over.

Code:
 <style type="text/css"> 
  td.blue { 
font-family: arial; font-weight: bold; font-size: 12px; color: #000000; text-decoration: none;
  border: 0px; 
  background: #71B9FF; 
} 
td.blue2 { 
font-family: arial; font-weight: bold; font-size: 12px; color: #000000; text-decoration: none;
  border: 0px; 
  background: #C1E0FF;
} 
td.blue3 { 
font-family: arial; font-weight: bold; font-size: 12px; color: #000000; text-decoration: none;
  border: 0px; 
  background: #0000FF;
}
</style>
<table><tr>
<td class="blue" onclick="document.getElementById('rad1').checked='true'; this.className='blue3';" onmouseover="this.className='blue2'" onmouseout="this.className='blue'" align="center"><img src="images/asdf.gif" width="114" height="149"><br><input type="radio" name="asdf" id="rad1" value="asdf">
asdf</td>
<td class="blue" onclick="document.getElementById('rad2').checked='true'; this.className='blue3';" onmouseover="this.className='blue2'" onmouseout="this.className='blue'" align="center"><img src="images/asdf.gif" width="114" height="149"><br><input type="radio" name="asdf" id="rad2" value="asdf">
asdf</td>
</tr>
</table>
Another thing that I would like it to do is change an image in another area of the page depending on which radio button is clicked. Can someone please help me out with the code for this?

Thanks, Matt