JSFiddle - React, Tailwind, and code Playground

by Dogbert

HTML

<div id="highlight-spam-words">
  <textarea class="input" placeholder="Type/Paste text here"></textarea>
  <div class="output"></div>
</div>

CSS

body,
textarea {
  font-family: Georgia;
  font-size: 15px;
  width: 500px;
  margin: 10px auto;
}

textarea {
  height: 300px;
  width: 100%;
}

.highlight {
  background: red;
  color: white;
}

JavaScript

var words = /lorem|has|desktop|passages|popularised/gi;

var $el = $("#highlight-spam-words");
var $input = $el.find(".input");
var $output = $el.find(".output");

$input.on("change keyup", function() {
  $output.html($input.val().replace(words, function(word) {
    return "<span class='highlight'>" + word + "</span>";
  }));
});