title: Replicate the line highlighting in devtools
body: <p>I'd like to replicate the functionality of devtools when using the select element feature (that's what it's called in chrome devtools at least).</p>
  
  <p>I'm thinking that I'll have one div with the inspectable content, and then another div that has the html inside. then I'll be able to hover over the elements in the inspectable div, and it will highlight the code snippet in the html div.</p>
  
  <p>Does anyone have any bright ideas about how to go about doing this? Especially when the html div will not just be a block of text, but also have indenting and line breaks etc.</p>
  
  <p>Looking for a JS/React solution, or just some concepts about how it might be done!</p>
  
  <p><a href="https://i.stack.imgur.com/rCC0F.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/rCC0F.png" alt="Devtools line highlight"></a></p>