JSFiddle - React, Tailwind, and code Playground

by Pranesh Ravi

HTML

<div class="wrapper"></div>
<button>Refresh</button>

CSS

.wrapper span:nth-child(odd) {
  color: red;
}

JavaScript

function loadJson() {

  $.getJSON('https://raw.githubusercontent.com/boennemann/animals/master/words.json', function(data) {

    var s = data[Math.floor((Math.random() * data.length))];

    for (i = 0; i < s.length; i++) {

      var $span = $("<span>", {
        class: " letter" + i
      }).appendTo(".wrapper");;
      $span.append(s[i]);
    }
  });

}

loadJson();

$("button").click(function() {
  loadJson();
});