JSFiddle - React, Tailwind, and code Playground
HTML
<div id='content'></div>
JavaScript
function CreateLoader(){
var img = document.createElement("img");
img.id = "ajaxloader"
img.src = "http://www.titleist.com/images/products/ball_fitting/ajax-loading.gif";
img.alt = "";
img.setAttribute('width', "25%");
img.setAttribute('height', "25%");
document.getElementById("content").appendChild(img);
img.show = function(){ img.style.display = "block"; }
img.hide = function(){ img.style.display = "none"; }
img.hide();
return img;
}
var eLoader = CreateLoader();
var http = new XMLHttpRequest();
var url = "/echo/html/";
var params = "html=Response&delay=3";
http.open("POST", url, true);
http.onreadystatechange = function() {
if(http.readyState == 4 && http.status == 200) {
eLoader.hide();
document.getElementById('content').innerHTML = http.responseText
}
}
function BeginLoading(){
eLoader.show();
http.send(params);
}
BeginLoading()