Highlight table row and select radio input when table row clicked jquery - php

Question

I'm trying to achieve something similar to this :
I want to select a radio input and highlight a table row when someone clicks somewhere in the table .Same idea is this but with radio input
http://jsfiddle.net/FbHAV/2/
can I get some help ? What should I change in the Jquery?
HTML :
<table class="record_table">
<tr>
<td>
<input type="radio" />
</td>
<td>Hello</td>
<td>Hello</td>
</tr>
<tr>
<td>
<input type="radio" />
</td>
<td>Hello</td>
<td>Hello</td>
</tr>
<tr>
<td>
<input type="radio" />
</td>
<td>Hello</td>
<td>Hello</td>
</tr>
<tr>
<td>
<input type="radio" />
</td>
<td>Hello</td>
<td>Hello</td>
</tr>
Jquery :
$(document).ready(function () {
$('.record_table tr').click(function (event) {
if (event.target.type !== 'radio') {
$(':radio', this).trigger('click');
}
});
$("input[type='radio']").change(function (e) {
if ($(this).is(":checked")) {
$(this).closest('tr').addClass("highlight_row");
} else {
$(this).closest('tr').removeClass("highlight_row");
}
});
});

Answer 1

I think the major problem is that you forget to group the radio buttons, i.e
<input type="radio" name="test" />
Then this will work both when clicking on the radio button and the <tr> :
$(document).ready(function () {
$('.record_table tr').click(function (event) {
if (event.target.type !== 'radio') {
$(':radio', this).trigger('click');
}
});
$("input[type='radio']").change(function (e) {
e.stopPropagation();
$('.record_table tr').removeClass("highlight_row");
if ($(this).is(":checked")) {
$(this).closest('tr').addClass("highlight_row");
}
});
});
forked fiddle -> http://jsfiddle.net/48o1kycu/