title: toggleClass() on Parent not working even though the parent is being found
body: <p>Hi I have the following HTML repeated in my page (obviously the names, for and id attributes change in each instance):</p>
  
  <pre><code>&lt;div class="funkyCheckBox"&gt;
  &lt;label for="uniqueName"&gt; Whatever Text &lt;/label&gt;
  &lt;input type="checkbox"  name="uniqueName" id="uniqueName" /&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>What this does with some CSS is make the give the appearance of a big button, the input is hidden and I add a class to the div depending on the checked value of the input. I use the following JavaScript /jQuery for this</p>
  
  <pre><code>$(".funkyCheckBox").live("click, tap", function(event){
      $(this).toggleClass("funkyCheckBoxActive");
      var nextCheckBox = $(this).find("input[type=checkbox]");
      nextCheckBox.prop("checked", !nextCheckBox.prop("checked"));
  });
  </code></pre>
  
  <p>Now this was all fine and good but during testing I noticed that if you click on the label text the class was not applied and the value of the input isn't toggled... thus I added the following...</p>
  
  <pre><code>$(".funkyCheckBox label").live("click, tap", function(event){                  
      $(this).parent("div").toggleClass("funkyCheckBoxActive");
      var nextCheckBox = $(this).next("input[type=checkbox]");
      nextCheckBox.prop("checked", !nextCheckBox.prop("checked"));
  }); 
  </code></pre>
  
  <p>Now this is great as clicking the label text now changes the value of the input however the parent DIV is not taking / toggling the "funkyCheckBoxActive" class. I am unsure why is as I then used <code>console.log($(this).parent("div"))</code> within the callback function and I am outputting the attributes of th dom object. Does anyone know why my <code>toggleClass</code> is not being applied?</p>