JSFiddle - React, Tailwind, and code Playground

HTML

<h1>Lorem ipsum dolor sit.</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aut nisi itaque suscipit sequi quam atque perspiciatis numquam amet modi illo excepturi voluptatibus natus. Consequatur repellendus dicta ad nemo quibusdam aliquid!</p>
<p>Voluptatum laudantium voluptatem minima fugiat quisquam officia consequuntur error sapiente molestiae nemo enim natus numquam aperiam fugit ex minus harum iste assumenda. Reiciendis distinctio consequuntur dolor quaerat illum a ducimus?</p>
<p>Eligendi earum voluptate necessitatibus rem est delectus explicabo? Hic vel laborum assumenda reiciendis voluptate aperiam nulla sed soluta dolorum quaerat saepe quae ipsum unde iste sapiente minima quam at tenetur.</p>
<p>Itaque porro id necessitatibus numquam impedit eos debitis tenetur cum ratione corrupti quos ut fugiat aperiam provident voluptatibus suscipit minima distinctio nisi similique natus! Dolor eos amet minima magnam vitae!</p>
<p>Magnam suscipit neque ipsa magni unde aliquam voluptatum harum quisquam dolor ex minus numquam culpa laboriosam voluptate cum consequatur eos animi dicta at perspiciatis voluptas maxime debitis libero. Enim perspiciatis?</p>
<p>Maxime modi ipsam iste mollitia culpa nulla quos minima dolor quia ullam labore blanditiis libero soluta debitis nostrum delectus eligendi est optio natus facere. Iste beatae praesentium labore enim nesciunt!</p>

CSS

.red {
    color: #f00;
}

JavaScript

// Find text in descendents of an element, in reverse document order
// pattern must be a regexp with global flag
//
function findText(element, pattern, callback) {
    for (var childi= element.childNodes.length; childi-->0;) {
        var child= element.childNodes[childi];
        if (child.nodeType==1) {
            findText(child, pattern, callback);
        } else if (child.nodeType==3) {
            var matches= [];
            var match;
            while (match= pattern.exec(child.data))
                matches.push(match);
            for (var i= matches.length; i-->0;)
                callback.call(window, child, matches[i]);
        }
    }
}

findText(document.body, /dolor/g, function(node, match) {
    var span= document.createElement('span');
    span.className= 'red';
    node.splitText(match.index + 5); // +5 is the length of the string to replace
    span.appendChild(node.splitText(match.index));
    node.parentNode.insertBefore(span, node.nextSibling);
});