JSFiddle - React, Tailwind, and code Playground

HTML

Type a sentence that contains the word <u>'wrong'</u> !
<div id="text">
    <p></p>
    <input type="text" id="texta" />
</div>

CSS

#text {position: absolute; height: 30px; width: 600px; top: 50px; left: 40px;}
#texta {position: absolute; height: 100%; width: 100%; color: transparent;}
p {display: inline-block; position: absolute; margin: 7px 0 0 3px; z-index: 2; color: #000;}
.red {color: red; font-weight: bold;}

JavaScript

$("#texta").keyup(function() {
    var word = 'wrong',
        re = new RegExp(word, "gi");
        typed = $(this).val().replace(re, '<span class="red">' + word + '</span>');
    $('p', '#text').html(typed)
});