title: Multiple checkboxes jquery manual clicked checkbox fires, but 'code clicked' one doesn't
body: <p>I have multiple checkboxes that when all are checked - they check a parent checkbox. When that parent checkbox is checked an alert is fired and an image is faded in...</p>
  
  <p><strong>The problem is</strong> that when the parent checkboxes are checked using jquery they do not show the alert or swap the image, <em>it only works when the checkbox is checked manually.</em></p>
  
  <p>Here is my code:
      // Parent Checkboxes -multiple checkboxes</p>
  
  <pre><code>$("input[type='checkbox'].PARENT-CHECKBOXES").change(function(){
      var a = $("input[type='checkbox'].PARENT-CHECKBOXES");
      if(a.length == a.filter(":checked").length){
          alert('ACTION COMPLETED');
          TweenMax.to("#fade-in-image", 0.1, {autoAlpha: 1});
      }
  });
  
  // Child Checkboxes -multiple checkboxes
  
  $("input[type='checkbox'].CHILD-CHECKBOX").change(function(){
      var step1 = $("input[type='checkbox'].CHILD-CHECKBOX");
      if(step1.length == step1.filter(":checked").length){
          alert('SKU OPERATION COMPLETE');
          $("#PARENT-CHECKBOX1").prop("checked", true);           
      }
  });
  </code></pre>
  
  <p>EDIT: So I edited my code and this is the working result. </p>
  
  <pre><code>var a = $("input[type='checkbox'].PARENT-CHECKBOXES");
  
  $("input[type='checkbox'].CHILD-CHECKBOX").change(function(){
  var step2 = $("input[type='checkbox'].CHILD-CHECKBOX");
  if(step2.length == step2.filter(":checked").length){
          alert('Operation Complete');
          $("#PARENT-CHECKBOX1").prop("checked", true).change();
      }
  if(a.length == a.filter(":checked").length){
      alert('ACTION COMPLETED');
      TweenMax.to("#fade-in-image", 0.1, {autoAlpha: 1});
  }
  });
  </code></pre>