JSFiddle - React, Tailwind, and code Playground

by Andy Mcloughlin

HTML

<h1>gardening for dummies <span>testing blah</span></h1>


<h2 id="myId">youtube 101</h2>


<h3>third one <strong>dfdf</strong></h3>
here's a text child thats part of the main body

CSS

strong {
    -webkit-transition-duration:1s;
}
h1 > span {
    
    opacity:0.4;
}

JavaScript

var textNodes = 0;
for (var ele=document.getElementById("myId"); ele; ele = ele.nextSibling) {
    if(ele.nodeName !== "#text"){
        ele.innerHTML = "<span style='color:#f00'>" + ele.innerHTML + "</span>";
    }else {
    textNodes++;
    }
    
}
var name = prompt("whats your name?");


alert("found " + textNodes + " text node(s).");