JSFiddle - React, Tailwind, and code Playground
HTML
<body>
<div id="loading" class="hidden">LOADING...</div>
<p id="hello">Hello World</p>
</body>
JavaScript
var divvy = function (l, thing) {
var d = $('<div></div>');
var l = $('<label>'+l+':</label>');
var s = $('<span></span>');
s.text(thing === undefined ? '[undefined]' : thing.toString());
$(l).appendTo(d);
$(s).appendTo(d);
$(d).appendTo("body");
};
// prove basic Ajax functionality working
$.ajax({
data: {
html: "some html to echo",
delay: 2 //delays echo response 2 seconds
},
url: "/echo/html/",
type: "POST",
success: function (data, textStatus, jqXHR) {
divvy('data', data);
divvy('textStatus', textStatus);
divvy('statusCode', statusCode);
}
});
// adding the setTimeout function to let the first example
// complete before this one runs.
setTimeout(function () {
$.ajax({
url: "https://api.twitter.com/oauth/access_token",
error: function (jqXHR, textStatus, errorThrown, response) {
console.log(jqXHR);
divvy('jqXHR', jqXHR);
divvy('responseText', jqXHR.responseText);
divvy('responseJSON', jqXHR.responseJSON);
divvy('responseXML', jqXHR.responseXML);
divvy('textStatus', textStatus);
divvy('statusCode', statusCode);
divvy('errorThrown', errorThrown);
divvy('response', response);
}
});
}, 6000);