title: Create "check all" / "select all" checkbox with jQuery?
body: <p>I have few checkboxes , out of which one is "Select All" and the others are some standalone's.</p>
  
  <p>The requirement is that </p>
  
  <ol>
  <li>Ifthe user click on "Select All" checkbox, then all other checkboxes will be checked.</li>
  <li>If he unchecks the "Select All" checkbox , then everything will be unchecked. </li>
  <li>And if any one of the individual checkbox is unchecked, then the "Select all" will be unchecked. </li>
  <li>If all the four check boxes are checked, then the "Select All" will be checked.</li>
  </ol>
  
  <p>I am using JQuery. I am able to achieve the first two but not the last two. My code is as under</p>
  
  <pre><code>&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"&gt;
  &lt;HTML&gt;
   &lt;HEAD&gt;
    &lt;TITLE&gt; Check / UnCheck All Checkbox &lt;/TITLE&gt; 
  
    &lt;script  type="text/javascript" src="jquery.js"&gt;&lt;/script&gt;
  
    &lt;script type="text/javascript"&gt;
  
    function SelectDeselect()
    {
          if(document.getElementById('chkSelectDeselectAll').checked)  $("INPUT[type='checkbox']").attr('checked',true); 
  
          else  $("INPUT[type='checkbox']").attr('checked',false); 
    }
  
    &lt;/script&gt;
  
   &lt;/HEAD&gt;
  
   &lt;BODY&gt;
  
  
      &lt;input type="checkbox" id="chkSelectDeselectAll" onClick="SelectDeselect()"&gt;Select All
      &lt;br&gt;&lt;br&gt;
  
      Select your hobbies:
      &lt;br&gt;&lt;br&gt;
  
      &lt;input type="checkbox" id="chkTV"&gt;Watching T.V.&lt;br&gt;&lt;br&gt;
  
      &lt;input type="checkbox" id="chkGardening"&gt;Gardening&lt;br&gt;&lt;br&gt;
  
      &lt;input type="checkbox" id="chkSwimming"&gt;Swimming&lt;br&gt;&lt;br&gt;
  
      &lt;input type="checkbox" id="chkChess"&gt;Playing Chess&lt;br&gt;&lt;br&gt;
  
   &lt;/BODY&gt;
  &lt;/HTML&gt;
  </code></pre>
  
  <p>Need help to implement the rest.</p>
  
  <p>Thanks</p>