How to stop checking checkboxes after a number of checkboxes have been checked for a few questions
<p>I know how to stop checking checkboxes after a number of checkboxes have been checked. My problem is how to do this for a few questions, each of which can have multiple checkboxes ticked.</p>

<p>My code is at <a href="http://jsfiddle.net/drSJV/53/" rel="nofollow">jsFiddle</a> and visible below:</p>

<p><strong>Code snippet</strong></p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code> 
 $('input[type="checkbox"]').click(function(event) {
    if (this.checked &amp;&amp; $('input:checked').length &gt; 3) {
        event.preventDefault();
        alert('You\'re not allowed to choose more than 3 boxes');
    }
});
 </code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;p&gt;&lt;strong&gt;&lt;em&gt;Question 1 &lt;/em&gt;&lt;/strong&gt;&lt;/p&gt;
 &lt;br&gt;&lt;/br&gt;&lt;br&gt;&lt;/br&gt;
 &lt;div id="Checklist1B10"&gt;
 &lt;table&gt;
 &lt;tr&gt;
 &lt;td width="1%"&gt; 
 &lt;input type="checkbox"  name="QUESTION1" id="QUESTION1A1"/&gt;
 &lt;/td&gt; 
 &lt;td width="15%"&gt;
 &lt;label for="QUESTION1A1"&gt;Strongly Disagree4&lt;/label&gt;
 &lt;/td&gt;
 &lt;td width="1%"&gt;
 &lt;input type="checkbox" name="QUESTION1" id="QUESTION1A2"/&gt;
 &lt;/td&gt; 
 &lt;td width="15%"&gt; 
 &lt;label for="QUESTION1A2"&gt;Disagree&lt;/label&gt;
 &lt;/td&gt; 
 &lt;td width="1%"&gt; 
 &lt;input type="checkbox"  name="QUESTION1" id="QUESTION1A3"/&gt; 
 &lt;/td&gt; 
 &lt;td width="15%"&gt; 
 &lt;label for="QUESTION1A3"&gt;Undecided&lt;/label&gt;
 &lt;/td&gt; 
 &lt;/tr&gt; 
 &lt;tr&gt; 
 &lt;td width="1%"&gt;
 &lt;input type="checkbox"  name="QUESTION1" id="QUESTION1A4"/&gt;
 &lt;/td&gt; 
 &lt;td width="15%"&gt;
 &lt;label for="QUESTION1A4"&gt;Agree&lt;/label&gt;
 &lt;/td&gt; 
 &lt;td width="1%"&gt;
 &lt;input type="checkbox"  name="QUESTION1" id="QUESTION1A5"/&gt;
 &lt;/td&gt; 
 &lt;td width="15%"&gt;&lt;label for="QUESTION1A5"&gt;Strongly Agree &lt;/label&gt;
  &lt;/td&gt;
 &lt;/tr&gt;
 &lt;/table&gt;
 &lt;/div&gt;
 &lt;p&gt;&lt;strong&gt;&lt;em&gt;Question 2 &lt;/em&gt;&lt;/strong&gt;&lt;/p&gt;
&lt;br&gt;&lt;/br&gt; &lt;br&gt;&lt;/br&gt; 
&lt;div class="c7" id="Checklist2B10"&gt; 
&lt;input type="checkbox" name="QUESTION2" id="QUESTION2A1"/&gt;
&lt;label for="QUESTION2A1"&gt;Monday&lt;/label&gt;
&lt;br&gt;&lt;/br&gt; 
&lt;input type="checkbox" name="QUESTION2" id="QUESTION2A2"/&gt;
&lt;label for="QUESTION2A2"&gt;Tuesday&lt;/label&gt;
&lt;br&gt;&lt;/br&gt; 
&lt;input type="checkbox"  name="QUESTION2" id="QUESTION2A3"/&gt;
&lt;label for="QUESTION2A3"&gt;Wednesday&lt;/label&gt;
&lt;br&gt;&lt;/br&gt; 
&lt;input type="checkbox"  name="QUESTION2" id="QUESTION2A4"/&gt; 
&lt;label for="QUESTION2A4"&gt;Thursday&lt;/label&gt;
&lt;br&gt;&lt;/br&gt;
&lt;input type="checkbox"  name="QUESTION2" id="QUESTION2A5"/&gt; 
&lt;label for="QUESTION2A5"&gt;Friday&lt;/label&gt;
&lt;br&gt;&lt;/br&gt; 
&lt;input type="checkbox"  name="QUESTION2" id="QUESTION2A6"/&gt;
&lt;label for="QUESTION2A6"&gt;Saturday&lt;/label&gt;
&lt;br&gt;&lt;/br&gt; 
&lt;input type="checkbox"  name="QUESTION2" id="QUESTION2A7"/&gt; 
&lt;label for="QUESTION2A7"&gt;Sunday&lt;/label&gt;
&lt;br&gt;&lt;/br&gt; 
&lt;/div&gt; </code></pre>
</div>
</div>
</p>