JSFiddle - React, Tailwind, and code Playground

by anomepani

HTML

<script src="https://code.jquery.com/jquery-2.2.2.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.16/d3.min.js"></script>
<div class='old'><p>OLD way to color</p><p>OLD way to color</p>
<p>OLD way to color</p><p>OLD way to color
</p>
</div>

<div class='new'><p>New way to color</p><p>New way to color</p>
<p>New way to color</p><p>New way to color
</p>
</div>

JavaScript

//Modifying documents using the W3C DOM API 
var oldStyle=document.getElementsByClassName('old');
var paragraphs = oldStyle[0].getElementsByTagName("p");
for (var i = 0; i < paragraphs.length; i++) {
  var paragraph = paragraphs.item(i);
  paragraph.style.setProperty("color", "blue", null);
}

//Re write above code with single line using declarative
d3.selectAll(".new>p").style("color", "red");