title: Selection range to HTML element
body: <p>How can I transform a selected text range into a HTML element?</p>
  
  <p>For example, string <code>The quick brown fox jumps over the lazy dog</code>, I've fetched the part <code>brown</code> that reflects selection points <code>start = 10</code> and <code>end = 14</code> (selection isn't built by user input).</p>
  
  <p>Now, how do I transform this part of string into a <code>&lt;span&gt;brown&lt;/span&gt;</code>?</p>
  
  <p>P.S. I've looked into <a href="https://stackoverflow.com/questions/1730967/how-to-wrap-with-html-tags-a-cross-boundary-dom-selection-range">How to wrap with HTML tags a cross-boundary DOM selection range?</a>. The answer provided uses execCommand, but that doesn't satisfy me, because I need this to be as transparent as possible. </p>
  
  <p>I'm using <code>Range</code> API for selections too, but as in this case- the "selection" is just stored pointers of <code>start/end</code> locations with no selection actually made.</p>
  
  <p>I had an idea that I could use the pointers to create a selection in the background, wrap with <code>&lt;/span&gt;</code> and that would be invisible to user, but then again... I have no idea how to execute this.</p>
  
  <p>Thanks in advance!</p>