JSFiddle - React, Tailwind, and code Playground

by spliter

HTML

<p id="first">
    Hello lorem ispum 
    <a id="link" href="...">This is a link</a> 
    linkety link blag
</p>

CSS

span.wrapper {color: Red};

JavaScript

var paragraph = document.getElementById('first'),
    list = paragraph.childNodes,
    el, i = 0, result = [];

for(i; i < list.length; i++) {
    el = list[i];
    if (el.nodeType === 3) {
        container = document.createElement('span');
        container.className = 'wrapper';
        // we want to remove line breaks from the text
        container.innerText = el.nodeValue.replace(/(\r\n|\n|\r)/gm,"");
        el = container;
    }
    result.push(el);
}
document.body.appendChild(result[0]);
document.body.appendChild(result[1]);
document.body.appendChild(result[2]);