Question

I can reset all radio buttons over many rows with the following jQuery.

$( ".reset_location" ).click(function() {
    $('#tbl_outside table.tbl_Inside input:radio').each(function(){
            $(this).attr("checked", false);
    });
    $('#tbl_outside table.tbl_Inside input:radio').effect("pulsate");
});

What I need to do is if the user clicks on the reset_location radio (class=reset_location) then set the attr to checked false for the radios in tbl_Inside on that row (not all the rows).

Hope you can help?

<table id="tbl_outside">
<thead>
<tr>
    <td> Location </td>
</tr>
</thead>
<tbody>
    <tr id="1194">
    <td>
          <input type="radio" value="reset" class="reset_location"/>
    </td>
    <td>
        <table class="tbl_Inside" id="93cf9d8ba8" >
        <tbody>
          <tr>
              <td></td>
              <td>
                   <input type="radio" value="h" name="93cf9d8ba8"/>
              </td>
              <td></td>
          </tr>
          <tr>
              <td>
                   <input type="radio" value="l" name="93cf9d8ba8"/>
              </td>
              <td>
                    <input type="radio" value="c" name="93cf9d8ba8"/>
              </td>
              <td>
                    <input type="radio" value="r" name="93cf9d8ba8"/>
              </td>
          </tr>
          <tr>
              <td></td>
              <td>
              <input type="radio" value="f" name="93cf9d8ba8"/>
              </td>
              <td></td>
          </tr>
          </tbody>
          </table>
     </td>
    </tr>
    <tr id="1193">
    <td>
          <input type="radio" value="reset" class="reset_location"/>
    </td>
    <td>
        <table class="tbl_Inside" id="123456" >
        <tbody>
          <tr>
              <td></td>
              <td>
                   <input type="radio" value="h" name="123456"/>
              </td>
              <td></td>
          </tr>
          <tr>
              <td>
                   <input type="radio" value="l" name="123456"/>
              </td>
              <td>
                    <input type="radio" value="c" name="123456"/>
              </td>
              <td>
                    <input type="radio" value="r" name="123456"/>
              </td>
          </tr>
          <tr>
              <td></td>
              <td>
              <input type="radio" value="f" name="123456"/>
              </td>
              <td></td>
          </tr>
          </tbody>
          </table>
     </td>
    </tr>
</tbody>
</table>

Answer 1

Search for the parent <tr> element, and select all input[type="radio"] elements. Unless you’re using an old version of jQuery, you should use .prop() instead of .attr() to set a property.

$( ".reset_location" ).click(function() {
    $(this).parents('tr:first').find(':radio')
        .prop("checked", false)
        .effect("pulsate");
});