title: jQUery syntax for multiple groups of checkboxes, each with their own "check all" option
body: <p>My code generates HTML forms from a template, and populates them with whatever input elements are required by the data being processed at the time. The resulting forms contain groups of checkboxes, each of which have their own 'check all' box. E.g.:</p>
  
  <pre><code>&lt;p&gt;Your breakfast order&lt;/p&gt;
  &lt;div class="a_bunch_of_checkboxes"&gt;
  &lt;input type="checkbox" class="checkAll"&gt;Check All
  &lt;input type="checkbox"&gt;Toast
  &lt;input type="checkbox"&gt;Eggs
  &lt;input type="checkbox"&gt;Bacon
  &lt;/div&gt;
  
  &lt;p&gt;Your lunch order&lt;/p&gt;
  &lt;div class="a_bunch_of_checkboxes"&gt;
  &lt;input type="checkbox" class="checkAll"&gt;Check All
  &lt;input type="checkbox"&gt;Salad
  &lt;input type="checkbox"&gt;Pizza
  &lt;input type="checkbox"&gt;Hot Dogs
  &lt;/div&gt;
  </code></pre>
  
  <p>Etc. (Obviously each "Check All" checkbox would check all boxes in that particular group only.)</p>
  
  <p>I am not too well versed in javascript and jQuery, and I have tried but failed to come up with the appropriate jQuery code to register an event handler to the "check all" checkboxes.</p>
  
  <p>Can anyone point me into the right direction?</p>