title: How is this element manipulation implemented?
body: <p>In Google Chrome, you can use shortcuts for elements with <code>contenteditable='true'</code>:</p>
  
  <p><code>CTRL + B</code> : Set the highlighted text to bold, for example</p>
  
  <p>What happens under the hood is, the <code>&lt;b&gt;</code> tag is attached or removed to the marked phrase, word whatever.</p>
  
  <p>How is this done? Where do "they" know from, whether the element is already set to bold, and, primary question, where it is located? </p>
  
  <p>I am asking this because i can't get rid of this problem, mentioned earlier today:</p>
  
  <p><a href="https://stackoverflow.com/questions/16103157/get-the-highlighted-text-position-in-html-and-text">Get the highlighted text position in .html() and .text()</a></p>
  
  <p><strong>Edit:</strong></p>
  
  <p>I tried the following</p>
  
  <p><a href="https://developer.mozilla.org/de/docs/Rich-Text_Editing_in_Mozilla#Executing_Commands" rel="nofollow noreferrer">Rich-Text-Editing</a></p>
  
  <p>But first, it won't load correctly, but this should be caused by my own failure.
  Second, for learning purposes, i would like to implent my own minified version.</p>
  
  <p>As i am really at JavaScript, i could not figure out how this is be done.</p>