如果禁用主要主复选框,则禁用子复选框

enter image description here

what i want is when is when i click on My Repairs all the sub-checkboxes should be enabled.. if My Repairs is disabled the sub check boxes also has to disable..

<table id="tblId" width="500" height="700" border="0"  class="even" align="center" bgcolor="#E8F8FF">

  <tr>
    <td width="49">1
      <input name="row[]" type="checkbox" id="1" value="1" <?  echo in_array("1", $row)  ? "checked" : ''; ?>/>

   </td>
    <td colspan="3">Active Repairs</td>
  </tr>

   <tr>
    <td>2
      <input name="row[]" type="checkbox" id="2" value="2" <?  echo in_array("2", $row)  ? "checked" : ''; ?> onclick="enab();"/></td>
    <td colspan="3">My Repairs</td>
  </tr>
  <div id="darkLayer" class="darkClass" style="display:none">
  <tr>
  <td></td>
    <td >3
      <input name="row[]" type="checkbox" id="3" value="3" <?  echo in_array("3", $row)  ? "checked" : '';?> /></td>
    <td colspan="2">Active Calls</td>
  </tr>
</table>

HTML

<div>    
             <input id="chkBlue" name="chkBlue" type="checkbox" value="blue" class="checkbox">Blue<br>  
           <input id="chkGreen" name="chkGreen" type="checkbox" value="green" class="checkbox" checked="true">Green
</div>

<div style="margin-left:20px;">           <input id="chkRed" name="chkMango" type="checkbox" value="Mango" class="checkbox2">Mango<br>
           <input id="chkBlue" name="chkOrange" type="checkbox" value="Orange" class="checkbox2">Orange<br>
           <input id="chkGreen" name="chkBanana" type="checkbox" value="Banana" class="checkbox2">Banana
      </div>

Jquery

$('#chkGreen').change(function () {              
   if( $('#chkGreen').prop('checked')==true)    
    $(".checkbox2").attr("disabled", true);
  else
       $(".checkbox2").attr("disabled", false);
              });

   if( $('#chkGreen').prop('checked')==true)    
    $(".checkbox2").attr("disabled", true);
  else
       $(".checkbox2").attr("disabled", false);

Demo