title: Limit Number of Checkboxes Checked
body: <p>I have a form with several checkboxes. I have three categories of checkboxes in the form. I need to limit to a max of three checkboxes <em>per</em> category. </p>
  
  <p>I used this script but it limits to three checkboxes per form. </p>
  
  <pre><code>jQuery(function(){
     var max = 3;
     var checkboxes = jQuery('input[type="checkbox"]');
  
     checkboxes.change(function(){
        var current = checkboxes.filter(':checked').length;
         checkboxes.filter(':not(:checked)').prop('disabled', current &gt;= max);
     });
  });
  </code></pre>
  
  <p>How do I modify the above script to limit three checkboxes per category within one form?</p>
  
  <p>HTML Example:</p>
  
  <pre><code>&lt;!-- FORM CODE --&gt; 
  
  &lt;!-- Start Categories --&gt;
  
  &lt;label&gt;Cat 1&lt;/label&gt;
    &lt;!-- Checkboxes for Cat 1 - Max of Three in Category --&gt;
    &lt;input type="checkbox" value="Option 1" id="CAT_Custom_365571_0" name="CAT_Custom_365571" /&gt;Creative&lt;br /&gt;
    &lt;input type="checkbox" value="Option 2" id="CAT_Custom_365571_1" name="CAT_Custom_365571" /&gt;Euphoric&lt;br /&gt;
    &lt;input type="checkbox" value="Option 3" id="CAT_Custom_365571_2" name="CAT_Custom_365571" /&gt;Uplifted&lt;br /&gt;
    &lt;!-- More checkboxes --&gt;
  &lt;label&gt;Cat 2&lt;/label&gt;
    &lt;!-- Checkboxes for Cat 2 - Max of Three in Category --&gt;
    &lt;input type="checkbox" value="Option 1" id="CAT_Custom_365572_0" name="CAT_Custom_365572" /&gt;Option 1&lt;br /&gt;
    &lt;input type="checkbox" value="Option 2" id="CAT_Custom_365572_1" name="CAT_Custom_365572" /&gt;Option 2&lt;br /&gt;
    &lt;input type="checkbox" value="Option 3" id="CAT_Custom_365572_2" name="CAT_Custom_365572" /&gt;Option 3&lt;br /&gt;
    &lt;!-- More checkboxes --&gt;
  &lt;label&gt;Cat 3&lt;/label&gt;
    &lt;!-- Checkboxes for Cat 3 - Max of Three in Category --&gt;
    &lt;input type="checkbox" value="Option 1" id="CAT_Custom_365573_0" name="CAT_Custom_365573" /&gt;Option 1&lt;br /&gt;
    &lt;input type="checkbox" value="Option 2" id="CAT_Custom_365573_1" name="CAT_Custom_365573" /&gt;Option 2&lt;br /&gt;
    &lt;input type="checkbox" value="Option 3" id="CAT_Custom_365573_2" name="CAT_Custom_365573" /&gt;Option 3&lt;br /&gt;
    &lt;!-- More checkboxes --&gt;
  
  &lt;!-- MORE FORM CODE --&gt;
  </code></pre>
  
  <p>Note: The <code>CAT_Custom_365571_2</code> etc is generated by the CMS I use.</p>