How can I use jquery to toggle "checked" for radio buttons within clickable table cells?
===

I have several forms that have radio buttons and checkboxes embedded in tables.  I want two use jquery to do two things:

* First, the user can "click" a radio button or checkbox by clicking the table cell that contains the button.

* Second, the user can toggle checkboxes **and** radio buttons by clicking twice.  Thus, clicking an already-checked radio button (or the cell containing it) should **un**-check it, leaving no radio button selected within the group.

I can do both of these separately, but I'm stuck on getting them to work together.  Please help!

Here's my not-quite-working jquery code:

    $(".clickable", Q)
        .mouseover( function(){ $(this).addClass('mouseover-cell'); })
        .mouseout( function(){ $(this).removeClass('mouseover-cell'); })
        .click( function(event){
            if( event.target.type != 'checkbox' && event.target.type != 'radio' ){
                var x = $('input', this).attr("checked");
                $('input', this).attr("checked", !x);

                //$('input', this).trigger("click");
            }
            return false;
        });


The html for a single button looks something like this:

    <tr>
      <td>
        Label for the button group
      </td>
      <td class="clickable">
        <input type="radio" name="q1" value="1">
      </td>
      <td class="clickable">
        <input type="radio" name="q1" value="2">
      </td>
      <td class="clickable">
        <input type="radio" name="q1" value="3">
      </td>
    </tr>