[jQuery] Newbie help on Radio select
Hi all,
I'm new to Jquery and I have a problem I'd like to ask. I've followed
a code snippet online to add a background color to a table column, but
my problem is that when the 2nd row is selected, the 1st row
disappears. How can I make each row remain on the td I've selected?
Here's the code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/
TR/html4/strict.dtd"><html>
<head>
<title></title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/
jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$('td').click( function(){
$('td.selected').removeClass('selected');
$(this).addClass('selected').children("input[@type=radio]").click();
});
});
</script>
<style type="text/css">
td { color: #000; }
td.selected { background-color: #ccc; }
</style>
</head>
<body>
<table>
<tr>
<td>Red <input type="radio" name="color" value="red" /></td>
<td>Blue <input type="radio" name="color" value="blue" /></td>
<td>Green <input type="radio" name="color" value="green" /></td>
</tr>
<tr>
<td>Apple <input type="radio" name="color" value="apple" /></td>
<td>Oranges <input type="radio" name="color" value="oranges" /></
td>
<td>Pears <input type="radio" name="color" value="pears" /></td>
</tr>
</table>
</body>
</html>