title: Listen to bootstrap checkbox being checked
body: <p>I am using bootstrap theme called: Core Admin
  <a href="http://wrapbootstrap.com/preview/WB0135486" rel="nofollow noreferrer">http://wrapbootstrap.com/preview/WB0135486</a></p>
  
  <p>This is the code I write:</p>
  
  <pre><code>&lt;div class="span6"&gt;
      &lt;input type="checkbox" class="icheck" id="Checkbox1" name="userAccessNeeded"&gt;
      &lt;label for="icheck1"&gt;Needed&lt;/label&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And bootstrap generates me this code:</p>
  
  <pre><code>&lt;div class="span6"&gt;
  &lt;div class="icheckbox_flat-aero" style="position: relative;"&gt;
      &lt;input type="checkbox" class="icheck" id="Checkbox7" name="userAccessNeeded" style="position: absolute; opacity: 0;"&gt;
      &lt;ins class="iCheck-helper" style="position: absolute; top: 0%; left: 0%; display: block; width: 100%; height: 100%; margin: 0px; padding: 0px; background-color: rgb(255, 255, 255); border: 0px; opacity: 0; background-position: initial initial; background-repeat: initial initial;"&gt;&lt;/ins&gt;
  &lt;/div&gt;
  &lt;label for="icheck1" class=""&gt;Needed&lt;/label&gt;
  </code></pre>
  
  <p></p>
  
  <p>This is the result: <img src="https://i.stack.imgur.com/kUa0q.png" alt="enter image description here"></p>
  
  <p>So basically it makes a pretty checkbox for me. Each time I click on the checkbox, it will add a <code>checked</code> class to the div:</p>
  
  <pre><code> &lt;div class="icheckbox_flat-aero checked" style="position: relative;"&gt;
  </code></pre>
  
  <p>So at first I wanted to listen the input field being changed like this</p>
  
  <pre><code>$('input[type="checkbox"][name="userAccessNeeded"]').change(function () {
      if (this.checked) {
  
      }
  });
  </code></pre>
  
  <p>But it doesn't actually change the input field, but rather changes the class of <code>&lt;div&gt;</code> element.</p>
  
  <p>How could I listen to checkbox being checked?</p>