title: Change color of a part of text inside a <p> tag according to user selection?
body: <p>I'm developing an extension for Google Chrome; as a part of it there is a text highlighting capability.</p>
  
  <p>I've managed to highlight a complete <code>&lt;p&gt;&lt;/p&gt;</code> tag (or any other tag) but I can't figure out how to highlight a part inside a tag. (user will not select an entire tag)</p>
  
  <p>I found that I should use <code>&lt;span&gt;</code> inside the <code>&lt;p&gt;</code> tag but I can't figure out a way to do it. </p>
  
  <ol>
  <li><p>How do I identify the part that the user selected?</p></li>
  <li><p>How do I highlight the selected part (eg change the back color)?</p></li>
  </ol>
  
  <p>A detailed explanation would be really helpful and highly appreciated, since I'm new to extension development. </p>