How to prevent a JQuery click reoccuring without preventing default?
<p>I'm having a not uncommon problem: I have a "click" event that is running twice per click. </p>

<pre><code>&lt;label class='refinement genre-refinement'&gt;
  &lt;input type='checkbox' /&gt;
  &lt;div class='refinement-checkbox'&gt;&lt;/div&gt;
&lt;/label&gt;

$(".genre-refinement").click(function() {
  console.log("Once or twice?");
}
</code></pre>

<p>This seems to be caused because I have a customised CSS checkbox (it works just once when the CSS is removed).</p>

<p>I have tried preventing default but that blocks the custom checkbox checking. Something like one("click") isn't appropriate because the label needs to be available to be checked and unchecked on whim. I have also tried moving my checkboxes outside of the label, which does not seem to do the trick.</p>

<p>I figure I can solve the problem by putting a checkmark into my JQuery and forgoing the customised checkbox but I'm hoping there might be an alternative.</p>

<p>Thanks for any tips!</p>