Question

This code should clear the checkboxes when I click the button. It works if I remove the <form></form> tags, but I thought .find() was supposed to find all descendants?

<script type="text/javascript">
$(document).ready(function(){

      var clearCheckboxes = function() {    
        $('.outerbox').find('input').each(function() {
          $(this).attr('checked', false);
        });
      }

      $('input.myButton').click(clearCheckboxes);
});
</script>

<div class="outerbox">    
  <form>
    <input type="checkbox" checked="" /> checkbox1
    <input type="checkbox" checked="" /> checkbox2
  </form>    
</div>
<input class="myButton" value="clear checkboxes now" type="button"/>

Answer 1

This code works fine for me: http://jsfiddle.net/CgsEu/

Anyway, if you are using the latest jQuery, try changing .attr to .prop. Also the .each isn’t needed. .attr and .prop work on all elements in a jQuery object.

var clearCheckboxes = function() {    
    $('.outerbox').find('input').prop('checked', false)
}

DEMO: http://jsfiddle.net/CgsEu/1/

If there are other inputs, try limiting the .find to just checkboxes.

var clearCheckboxes = function() {    
    $('.outerbox').find('input:checkbox').prop('checked', false)
}

DEMO: http://jsfiddle.net/CgsEu/2/