JSFiddle - React, Tailwind, and code Playground

HTML

<textarea class='check'></textarea><br>
<p class='result'></p>

CSS

.check{
width:400px;
height: 100px;
font-family : System !important;
}

.result{
padding:4px;
font-family: Verdana;   
}

.error{
background: red;   
}

JavaScript

$(document).ready(function(){
    $('textarea.check').change(function(){
        var typpedText = $(this).val();
        var words = typpedText.split(" ");
        var wordsLen = words.length;
        var resultArray = new Array();
        var currWord, word;
        
        for(i = 0; i<wordsLen; i++){
            currWord = words[i];
            var ruRegExp= /[а-яё]/i;
            var enRegExp= /[a-z]/i;
            if(ruRegExp.test(currWord) && enRegExp.test(currWord)){
                word = "<span class='error'>"+currWord+"</span>";
            }
            else{
                word = currWord;
            }
            resultArray.push(word);
        }
        $('.result').html(resultArray.join(' '));
    });
});