If I click on button in quick succession, it causes text selection
<p>Below I have a checkbox which is styled like a button:</p>

<pre><code> echo '&lt;p&gt;';
 foreach($options as $indivOption) {
     echo '&lt;div id="ck-button"&gt;&lt;label&gt;&lt;input type="checkbox" name="options[]" id="option-' . $indivOption . '" value="' . $indivOption . '" /&gt;&lt;span&gt;' . $indivOption . '&lt;/span&gt;&lt;/label&gt;&lt;/div&gt;';
 }
  echo '&lt;/p&gt;';
</code></pre>

<p>Now what happens is that if I click on the checkbox button quickly twice, it turns on the button but then it does not turn it off, it instead does a little text selection on the button. So if I have button known as <code>E</code>, if I click it twice quickly, it turns the button on and then it highlights the letter <code>E</code>.</p>

<p>My question is that for only the checkbox buttons, how in javascript as I assume it is client side to sort this out, how to prevent the text selection from happening only for the checkbox buttons, not for the whole document.</p>

<p>Thanks</p>
