JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container-fluid">
  <h1 class="text-center" style="margin-top:20px;">Random Quote Generator</h1>
  <div class="box">
    <div class="qt">
      <span id="qti"></span>
    </div>
    <div class="athr">- <span id="athr"></span></div>
    <div style="width:100%; clear:both; margin-left:auto; margin-right:auto; margin-top:6%;">
      <button class="btn" title="twitt it!" id="tit"><i class="fa fa-twitter"></i></button>
      <button class="btn pull-right" id="nqt">New Quote</button>
    </div>
  </div>
</div>

JavaScript

$(document).ready(function() {
  function cb() {
    var addr = "https://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1";
   return $.getJSON(addr, function(rslt) {
    console.log(rslt)
      return rslt;
    });
  };


  $.when(cb()).done(function(rslt){
 console.log(rslt)
   $("#qti").html(rslt[0].content);
    $("#athr").html(rslt[0].title);
  });
  $("#nqt").on("click", function() {
    qte(cb);
  });
  $("#tit").on("click", function() {
    window.open("https://twitter.com/intent/tweet?text=" + encodeURIComponent(qwe));
  });
});