title: onclick copy or highlight <code> to clipboard
body: <p>When person clicks on any <code>&lt;code&gt;</code> element it'll auto highlight everything inside plus copy to clipboard. I'm writing articles and there are lots of copy / paste commands being used for SSH. It would be nice if I could shave off a few dozen clicks for the visitor. I get this error when I try the code below:</p>
  
  <p><a href="https://i.stack.imgur.com/o20OO.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/o20OO.png" alt="here is the error i receive"></a></p>
  
  <pre><code>$(function () {
      $(document).on('click', 'code', function () {
          this.select();
      });
  });
  </code></pre>
  
  <p>I write these articles in markdown, and when I export, it's just clean code. I would prefer if I didn't have to use Flash or add a class or id to the html. Instead, just assume everything inside <code>&lt;code&gt;</code> should be copied to clipboard on click.</p>
  
  <p>I also just tried this, but still no luck.</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  $('code').focus(function () {
    this.select();
    this.setSelectionRange(0, 9999);
  }).mouseup(function (e) {
    e.preventDefault();
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>source</p>
  
  <p><a href="https://stackoverflow.com/questions/4067469/selecting-all-text-in-html-text-input-when-clicked">Selecting all text in HTML text input when clicked</a></p>
  
  <p><a href="http://jsfiddle.net/NNqyF/" rel="nofollow noreferrer">http://jsfiddle.net/NNqyF/</a></p>