Jquery event on wrapped input radio override 'checked' event

Question

I want to check and uncheck (toggle) the radio when "td" is click but preserving the default input event

<table>
   <tr>
      <td>
          <input type='radio'>
      </td>
   </tr>
</table>

My code attempts:

Try 1: http://jsfiddle.net/UJXRu/

Try 2: http://jsfiddle.net/UJXRu/1/

Try 3: http://jsfiddle.net/UJXRu/2/

Preview:

$("td").click(function(e) {
    if (!$(e.target).is("input")) {
        var bool = !$(this).children("input").is(':checked');
        $(this).children("input").attr("checked", bool)
    }
    else{
        var bool2 = !$(e.target).is(':checked');
        $(e.target).attr('checked',bool2);
    }
});

Answer 1

Try this out..

$("td").click(function(e) {
    if (e.target.type !== 'radio') {
        $(this).find(":radio").trigger('click');
    }
});

Example on jsfiddle.

If you want to make the td and radio button toggle the radio checked property you could do something like this:

$("td").toggle(function() {
    $(this).children(":radio").attr("checked", true);
}, function() {
    $(this).children(":radio").attr("checked", false);
});

Example on jsfiddle