JSFiddle - React, Tailwind, and code Playground

by sandeep45

HTML

<span style="border:2px solid black;height:50px" />

JavaScript

var increaseWidth = function(){
  var deferredObj = $.Deferred();

  // logic to increase width and call resolve when done
  $("span").animate(
    { "width": "500px"},
    { complete: function() {
        deferredObj.resolve();
      },
     duration: 5000
    }
  );

  return deferredObj.promise();
};

var addContent = function(){
  $("span").html("yo yo honey singh!")
};

increaseWidth().then(addContent);