title: Highlighting some texts in HTML with a backend process
body: <p>First of all be patient with me. I know it's not the best way to pose this question but I try my best. I have some scripts that do this:</p>
  
  <p>1- For one html file, get the readable part, tokenize it, do the part of speech tagging.</p>
  
  <p>2- Use the model to recognize the named entities (person, location, organization)</p>
  
  <p>Example of the text extracted form html: <code>Token1 Token2 Token3 Token4 ....</code></p>
  
  <p>So for each html file, I'm able to get the output in this format:
  <code>
  Token1 B-LOC
  Token2 I-LOC
  Token3 NON
  Token4 B-ORG
  ...</code></p>
  
  <p>This means that I have <code>Token1 Token2</code> as Location and <code>Token4</code> as Organization.</p>
  
  <p>Now, what I want to do is to go back to the html file, highlight the occurrences of any Location/Person/Organization. By highlighting I mean for example changing the color of background of them to different colors. E.g., green for Person, red for Org and yellow for Loc.</p>
  
  <p>What is the simplest/best way to do that? The only thing I thought of is to replace them in html by <code>&lt;span style="background-color: #FFFF00"&gt;Token1 Token2&lt;/span&gt;</code>. This has one drawback that my tokenization is not the same as how tokens are in the webpage. For example I might have <code>Token1Token2</code> in webpage but I can't find them by searching for <code>Token1 Token2</code>. This can be done also using some regular expression search. Is there any better was to do that?</p>
  
  <p>Another question: </p>
  
  <p>If I want to click on each distance or mouse over each instance and get a list of tokens that I already saved in the html file, how can I do that in html? Example I want my mouse to go over <code>Token1 Token2</code> and then I want a list shows up. Thanks a lot for your help. I truly appreciate.</p>