title: Get element node at caret position (in contentEditable)
body: <p>Let's say I have some HTML code like this:</p>
  
  <pre><code>&lt;body contentEditable="true"&gt;
     &lt;h1&gt;Some heading text here&lt;/h1&gt;
     &lt;p&gt;Some text here&lt;/p&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>Now the caret (the blinking cursor) is blinking inside the <code>&lt;h1&gt;</code> element, let's say in the word <code>"|heading"</code>. </p>
  
  <p>How can I get the element the caret is in with JavaScript? Here I would like to get node name: <code>"h1"</code>.</p>
  
  <p>This needs to work only in WebKit (it's embedded in an application). It should preferably also work for selections. </p>