Multiple Checkboxes and Expand Collapse in jQuery

I'm developing an Admin UI where the User Management page has a design as below: and

   <div id="UModules">
  <h2><input type="checkbox" class="checkall" value="" id="CheckAll" name="Mods" /> Modules <span class="all-links"><a id="EAll" href="#" name="EAll">Expand All</a> | <a id="CAll" href="#" name="CAll">Collapse All</a></span></h2>
  <!-- Sub Module 1 Starts -->

  <div class="panel panel-default">
     <div class="panel-heading que activestate">
        <h3 class="panel-title panel-text text-bold"><input type="checkbox" class="cbx" value="" id="pr" name="recev" /> Sub Module 1</h3>
     </div><!-- panel-body starts -->

     <div style="display: block;" class="panel-body pbody ans">
        <ul class="mod1">
           <li><label for="pr1"><input type="checkbox" class="cbx" value="" id="pr1" name="recev[]" /> Item 1</label></li>
        </ul>
        <hr class="spacer-line" />

        <ul class="mod1">
           <li><label for="pr2"><input type="checkbox" class="cbx" value="" id="pr2" name="recev[]" /> Item</label></li>
           <li><label for="pr3"><input type="checkbox" class="cbx" value="" id="pr3" name="recev[]" /> Item</label></li>
        </ul>
     </div><!-- panel-body ends -->
  </div><!-- Sub Module 1 Ends --><!-- Sub Module 2 Starts -->

  <div class="panel panel-default">
     <div class="panel-heading que activestate">
        <h3 class="panel-title panel-text text-bold"><input type="checkbox" class="cbx" value="" id="pt" name="pt" /> Sub Module 2</h3>
     </div><!-- panel-body starts -->

     <div style="display: block;" class="panel-body pbody ans">
        <ul class="mod1">
           <li><label for="pt1"><input type="checkbox" class="cbx" value="" id="pt1" name="pt[]" /> Item</label></li>
           <li><label for="pt2"><input type="checkbox" class="cbx" value="" id="pt2" name="pt[]" /> Item</label></li>
        </ul>
     </div><!-- panel-body ends -->
  </div><!-- Sub Module 2 Ends --><!-- Sub Module 3 Starts -->

  <div class="panel panel-default">
     <div class="panel-heading que activestate">
        <h3 class="panel-title panel-text text-bold"><input type="checkbox" class="cbx" value="" id="disp" name="disp" /> Sub Module 3</h3>
     </div><!-- panel-body starts -->

     <div style="display: block;" class="panel-body pbody ans">
        <ul class="mod1">
           <li><label for="disp1"><input type="checkbox" class="cbx" value="" id="disp1" name="disp[]" /> Item</label></li>
           <li><label for="disp2"><input type="checkbox" class="cbx" value="" id="disp2" name="disp[]" /> Item</label></li>
           <li><label for="disp3"><input type="checkbox" class="cbx" value="" id="disp3" name="disp[]" /> Item</label></li>
           <li><label for="disp4"><input type="checkbox" class="cbx" value="" id="disp4" name="disp[]" /> Item</label></li>
           <li><label for="disp5"><input type="checkbox" class="cbx" value="" id="disp5" name="disp[]" /> Item</label></li>
           <li><label for="disp6"><input type="checkbox" class="cbx" value="" id="disp6" name="disp[]" /> Item</label></li>
           <li><label for="disp7"><input type="checkbox" class="cbx" value="" id="disp7" name="disp[]" /> Item</label></li>
        </ul>
        <hr class="spacer-line" />

        <ul class="mod1">
           <li><label for="disp8"><input type="checkbox" class="cbx" value="" id="disp8" name="disp[]" /> Item</label></li>
           <li><label for="disp9"><input type="checkbox" class="cbx" value="" id="disp9" name="disp[]" /> Item</label></li>
           <li><label for="disp10"><input type="checkbox" class="cbx" value="" id="disp10" name="disp[]" /> Item</label></li>
           <li><label for="disp11"><input type="checkbox" class="cbx" value="" id="disp11" name="disp[]" /> Item</label></li>
        </ul>
     </div><!-- panel-body ends -->
  </div><!-- Sub Module 3 Ends --><!-- Sub Module 4 Starts -->

  <div class="panel panel-default">
     <div class="panel-heading que activestate">
        <h3 class="panel-title panel-text text-bold"><input type="checkbox" class="cbx" value="" id="rr" name="rr" /> Sub Module 4</h3>
     </div><!-- panel-body starts -->

     <div style="display: block;" class="panel-body pbody ans">
        <ul class="mod1">
           <li><label for="rr1"><input type="checkbox" class="cbx" value="" id="rr1" name="rr[]" /> Item</label></li>
           <li><label for="rr2"><input type="checkbox" class="cbx" value="" id="rr2" name="rr[]" /> Item</label></li>
           <li><label for="rr3"><input type="checkbox" class="cbx" value="" id="rr3" name="rr[]" /> Item</label></li>
        </ul>
        <hr class="spacer-line" />

        <ul class="mod1">
           <li><label for="rr4"><input type="checkbox" class="cbx" value="" id="rr4" name="rr[]" /> Item</label></li>
           <li><label for="rr5"><input type="checkbox" class="cbx" value="" id="rr5" name="rr[]" /> Item</label></li>
           <li><label for="rr6"><input type="checkbox" class="cbx" value="" id="rr6" name="rr[]" /> Item</label></li>
        </ul>
     </div><!-- panel-body ends -->
  </div><!-- Sub Module 4 Ends --><!-- Sub Module 5 Starts -->

  <div class="panel panel-default">
     <div class="panel-heading que activestate">
        <h3 class="panel-title panel-text text-bold"><input type="checkbox" class="cbx" value="" id="mm" name="mm" /> Sub Module 5</h3>
     </div><!-- panel-body starts -->

     <div style="display: block;" class="panel-body pbody ans">
        <ul class="mod1">
           <li><label for="mm1"><input type="checkbox" class="cbx" value="" id="mm1" name="mm[]" /> Item</label></li>
           <li><label for="mm2"><input type="checkbox" class="cbx" value="" id="mm2" name="mm[]" /> Item</label></li>
           <li><label for="mm3"><input type="checkbox" class="cbx" value="" id="mm3" name="mm[]" /> Item</label></li>
           <li><label for="mm4"><input type="checkbox" class="cbx" value="" id="mm4" name="mm[]" /> Item</label></li>
           <li><label for="mm5"><input type="checkbox" class="cbx" value="" id="mm5" name="mm[]" /> Item</label></li>
           <li><label for="mm6"><input type="checkbox" class="cbx" value="" id="mm6" name="mm[]" /> Item</label></li>
        </ul>
     </div><!-- panel-body ends -->
  </div><!-- Sub Module 5 Ends --><!-- Sub Module 6 Starts -->

  <div class="panel panel-default">
     <div class="panel-heading que activestate">
        <h3 class="panel-title panel-text text-bold"><input type="checkbox" class="cbx" value="" id="lb" name="lb" /> Sub Module 6</h3>
     </div><!-- panel-body starts -->

     <div style="display: block;" class="panel-body pbody ans">
        <ul class="mod1">
           <li><label for="lb1"><input type="checkbox" class="cbx" value="" id="lb1" name="lb[]" /> Item</label></li>
           <li><label for="lb2"><input type="checkbox" class="cbx" value="" id="lb2" name="lb[]" /> Item</label></li>
           <li><label for="lb3"><input type="checkbox" class="cbx" value="" id="lb3" name="lb[]" /> Verifier</label></li>
           <li><label for="lb4"><input type="checkbox" class="cbx" value="" id="lb4" name="lb[]" /> Item</label></li>
           <li><label for="lb5"><input type="checkbox" class="cbx" value="" id="lb5" name="lb[]" /> Item</label></li>
        </ul>
     </div><!-- panel-body ends -->
  </div><!-- Sub Module 6 Ends --><!-- Sub Module 7 Starts -->

  <div class="panel panel-default">
     <div class="panel-heading que activestate">
        <h3 class="panel-title panel-text text-bold"><input type="checkbox" class="cbx" value="" id="fc" name="fc" /> Sub Module 7</h3>
     </div><!-- panel-body starts -->

     <div style="display: block;" class="panel-body pbody ans">
        <ul class="mod1">
           <li><label for="fc1"><input type="checkbox" class="cbx" value="" id="fc1" name="fc[]" /> Item</label></li>
        </ul>
     </div><!-- panel-body ends -->
  </div><!-- Sub Module 7 Ends --><!-- Sub Module 8 Starts -->

  <div class="panel panel-default">
     <div class="panel-heading que activestate">
        <h3 class="panel-title panel-text text-bold"><input type="checkbox" class="cbx" value="" id="ss" name="ss" /> Sub Module 8</h3>
     </div><!-- panel-body starts -->

     <div style="display: block;" class="panel-body pbody ans">
        <ul class="mod1">
           <li><label for="ss1"><input type="checkbox" class="cbx" value="" id="ss1" name="ss[]" /> Item</label></li>
           <li><label for="ss2"><input type="checkbox" class="cbx" value="" id="ss2" name="ss[]" /> Item</label></li>
           <li><label for="ss3"><input type="checkbox" class="cbx" value="" id="ss3" name="ss[]" /> Item</label></li>
           <li><label for="ss4"><input type="checkbox" class="cbx" value="" id="ss4" name="ss[]" /> Item</label></li>
           <li><label for="ss5"><input type="checkbox" class="cbx" value="" id="ss5" name="ss[]" /> Item</label></li>
           <li><label for="ss6"><input type="checkbox" class="cbx" value="" id="ss6" name="ss[]" /> Item</label></li>
           <li><label for="ss7"><input type="checkbox" class="cbx" value="" id="ss7" name="ss[]" /> Item</label></li>
           <li><label for="ss8"><input type="checkbox" class="cbx" value="" id="ss8" name="ss[]" /> Item</label></li>
           <li><label for="ss9"><input type="checkbox" class="cbx" value="" id="ss9" name="ss[]" /> Item</label></li>
           <li><label for="ss10"><input type="checkbox" class="cbx" value="" id="ss10" name="ss[]" /> Item</label></li>
           <li><label for="ss11"><input type="checkbox" class="cbx" value="" id="ss11" name="ss[]" /> Item</label></li>
           <li><label for="ss12"><input type="checkbox" class="cbx" value="" id="ss12" name="ss[]" /> Item</label></li>
           <li><label for="ss13"><input type="checkbox" class="cbx" value="" id="ss13" name="ss[]" /> Item</label></li>
           <li><label for="ss14"><input type="checkbox" class="cbx" value="" id="ss14" name="ss[]" /> Item</label></li>
        </ul>
     </div><!-- panel-body ends -->
  </div><!-- Sub Module 8 Ends --><!-- Sub Module 9 Starts -->

  <div class="panel panel-default end-of-mod-div">
     <div class="panel-heading que activestate">
        <h3 class="panel-title panel-text text-bold"><input type="checkbox" class="cbx" value="" id="Repo" name="Repo" /> Sub Module 9</h3>
     </div><!-- panel-body starts -->

     <div style="display: block;" class="panel-body pbody ans">
        <ul class="mod1">
           <li><label for="Repo1"><input type="checkbox" class="cbx" value="" id="Repo1" name="Repo[]" /> Item</label></li>
           <li><label for="Repo2"><input type="checkbox" class="cbx" value="" id="Repo2" name="Repo[]" /> Item</label></li>
        </ul>
     </div><!-- panel-body ends -->
  </div><!-- Sub Module 9 Ends -->

I've achieved the functionality(follows) using jQuery with IFs and ELSE statements which I feel is not an optimized solution. So I would like to post it here for a simple and effective solution. Thanks much in advance.

Functionality/Requiment:

1. Expand ALL and Collapse All.
2. When the user clicks on MODULES label or MODULES Checkbox all the SUB MODULES should expand with all the Check-boxes of ITEMS Checked. Similarly when the Checkbox on MODULES is unchecked all Check-boxes on Sub Modules should be unchecked leaving expanded.
3. When the user clicks on Sub Modules 'X' label or ** Sub Modules x Checkbox** all the ITEMS Check-boxes should be Checked and vice-verse.