using a div as a radio button - php

Question

<div>
<table class='accor'>
<tr>
<td>Roll No.</td>
<td>12801</td>
</tr>
<tr>
<td>Name</td>
<td>XXXX</td>
</tr>
<tr>
<td>Class</td>
<td>MS</td>
</tr>
</table>
</div>
i want the above code as a radio button. the above code is running inside a php while loop with the data supplied from a database. (i also need to use checked=checked to match a predefined value.)
i am using the jquery ui buttonset style with the radio.
how can i achieve that?

Answer 1

$().buttonset takes all the input type='radio' elements inside the selector and makes a stylized button set out of them. For each of these elements, the associated label is placed on the display of the resulting button. So to have buttons with labels that aren't just a single line of text, just place the contents inside the label.
<form>
<div id="radio">
<input type="radio" id="radio1" name="radio" />
<label for="radio1">
<div>
<table class='accor'>
<tr>
<td>Roll No.</td>
<td>12801</td>
</tr>
<tr>
<td>Name</td>
<td>XXXX</td>
</tr>
</table>
</div>
</label>
<input type="radio" id="radio2" name="radio" checked="checked" />
<label for="radio2"><div>
<table class='accor'>
<tr>
<td>Roll No.</td>
<td>12801</td>
</tr>
<tr>
<td>Name</td>
<td>XXXX</td>
</tr>
</table>
</div>
</label>
</div>
</form>
JS:
$(function() {
$("#radio").buttonset();
});

Answer 2

try following (embed your code as you want):
$('.accor td').on("click",function(){
$('td').css('background-color','#eee');
var rowNumber = $(this).closest('tr').index();
setSelected(rowNumber);
});
function setSelected(rowNumber){
$('tr').eq(rowNumber).find('td').css('background-color','#ccc');
}
setSelected(2);
working fiddle here: http://jsfiddle.net/ZEwpE/2/
i hope it helps.

Answer 3

or another option to do that is:
$('.accor td').on("click",function(){
$('td').css('background-color','#eee');
var tr = $(this).parent();
$(tr).children().css('background-color','#ccc');
});
Get click event
Get parent (in your case it's )
Set css style to all childs of our
But it's only alternate (very similar) method:
jsfiddle