JSFiddle - React, Tailwind, and code Playground
HTML
<div id="container" contenteditable>
<p class="editor">test</p>
</div>
<!-- KOPIERA BARA DETTA TEST -->
<!-- something function() { run this (); } -->
CSS
purple {
color: purple;
}
JavaScript
$("#container").on("keyup", function(){
$(".editor").each(function(){
var fStr = "function";
var fPos = $(this).text().indexOf(fStr);
if (fPos >= 0) {
var pre = $(this).text().substr(0, fPos);
var after = $(this).text().substr(fPos + fStr.length, $(this).text().length);
$(this).html(pre + "<purple>" + fStr + "</purple>" + after);
}
});
})