JSFiddle - React, Tailwind, and code Playground

by MathiasaurusRex

HTML

<p id="paragraph">This is a sentence</p>

CSS

.first-word{
    color:red;
    font-size: 30px;
}

JavaScript

// grabs the #paragraph element
var string = document.getElementById('paragraph');
//grabs the content of the #paragraph element
var stringContent = string.innerHTML;
//pushes the string content into an array
var stringArray = stringContent.split(" ");
//wraps the first word in a span
stringArray[0] = '<span class="first-word">' + stringArray[0] + '</span>';
//pushes the array back into stringContent
stringContent = stringArray.join(' ');
//pushes stringContent back into your html
string.innerHTML = stringContent;