title: contentEditable attr set to true makes links in content unclickable
body: <p>I have a div with output content that sometimes outputs links.
  But when this output div has the contentEditable attribute set to true if makes the links unclickable.</p>
  
  <p>What's odd is you can still hover over it and before trying to click it it still looks and behaves like a link. (Blue in color, underlined, hover changes the color of blue, etc.) </p>
  
  <p>But when you go to click it it doesn't take you to the link. I can right click and say open or open in a new window and it works fine.</p>
  
  <p>Is there a way to make it clickable again so the user doesn't have to right click it all the time?</p>
  
  <pre><code>&lt;div contentEditable='true'&gt; 
      Some content with link: &lt;a href='https://google.com' target='_blank'&gt;Google&lt;/a&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Here is a JSFiddle example: <a href="https://jsfiddle.net/ce13w610/" rel="nofollow">https://jsfiddle.net/ce13w610/</a></p>
  
  <p>I still need the content to remain editable, but it would be nice to have the links working intuitively again.</p>
  
  <p>Edit: put additional solution as an answer, not an edit. :)</p>