title: how to get highlighted text positions using jquery
body: <p>I am trying to create a text highlighter. below is the example of the html structure.</p>
  
  <pre><code>&lt;div id="donthighlight"&gt;Sea no iuvaret epicurei conceptam, id dicunt sensibus expetenda&lt;/div&gt;
  &lt;div id="highlightarea"&gt;Lorem ipsum dolor sit amet, an zril splendide est, discere accusam&lt;/div&gt;
  </code></pre>
  
  <p>If I select the word "Lorem" from the second div, I should be able to capture the starting character position and ending character position, and add a span tag around it with a class. this will highlight the background of the text temporarily. function should only work within the second div.</p>
  
  <p>I Also want to save those character positions in DB, so that the next time user visit the same article I should be able show the previously highlighted parts. Also user should be able to remove highlights.</p>
  
  <p>I tried a few jquery plugins and was unable complete my requirements. How can I make this work? Any help would be appreciated</p>