JSFiddle - React, Tailwind, and code Playground
HTML
<div id="test">Testing
<p>Some more text inside p</p>
<p>asdasdasdasdasde p</p>
Test
</div>
CSS
strong
{
font-weight: bold;
}
JavaScript
getTextNodes(document.getElementById("test"));
function getTextNodes(parent)
{
var textNodes = [];
var nodes = parent.childNodes;
for(var i=0;i<nodes.length;i++)
{
if(nodes[i].nodeType === 3)
{
textNodes.push(nodes[i]);
wrapBold(nodes[i], parent);
}
}
}
function wrapBold(node, parent)
{
if(node.data.match(/[^\t\n\r ]/))
{
var bold = document.createElement("strong");
parent.insertBefore(bold, node);
bold.appendChild(node);
}else
{
return false;
}
}