JSFiddle - React, Tailwind, and code Playground
HTML
See Below to see setTimeout effect
<br>
<br>
<div id="textwrapper">The text will be changed after 3 second</div>
<br>
<br>
<input type="button" id="showDiv" value="Click to see SetTimeout effect">
CSS
#textwrapper{
background-color: #FFFF99;
color: #000;
display: none;
width: 30%;
/*margin: 0 auto;*/
padding: 10px 20px;
font-size: 20px;
}
input{
background-color: #FF5050;
color: #fff;
border:none;
padding: 10px 15px;
}
JavaScript
$("#showDiv").click(function () {
$('#textwrapper').show(1000, function () {
setTimeout(function () {
$('#textwrapper').html(function () {
setTimeout(function () {
$('#textwrapper').html('Text is replaced');
}, 0);
setTimeout(function () {
$('#textwrapper').html('Again text is replaced');
}, 2000);
});
}, 2000);
});
});