JSFiddle - React, Tailwind, and code Playground

by David Marshall

HTML

<pre>
<code>
int main()
    {
       printf("Hello World");
       return 0;
    }
    </code>
</pre>

CSS

pre div:hover {
  background-color: rgba(0, 0, 0, 0.2);
}

pre > code.highlight {
  outline: .4em solid red;
  outline-offset: .4em;
}

JavaScript

var txt = $('pre').html().split("\n");
var output = "";
for (var x = 0; x < txt.length - 1; x++) {
  output = output + "<div>" + txt[x] + "</div>";
}
$('pre').html(output);