JSFiddle - React, Tailwind, and code Playground

by Behzad Khosravifar

HTML

<div>
  <div class="test"> 
    Test Text <span id="countdown"></span>
  </div>
  <button class="test" id="countdown2">
    Test TEXT 2
  </button>
</div>

CSS

div {
  background: gray;
}

.test {
  /* margin: 50px; */
  background: green;
  color: red;
  display: block;
}

JavaScript

var countDown = function(elemId, initSecond, endCallback){
		var elem = $("#"+elemId);
    setInterval(function(){
      elem.text(initSecond--);
      if(endCallback && initSecond<=0)
      	endCallback();
        
    }, 1000)    
    console.log("finish")
}

countDown("countdown", 20, function(){ 
	alert("completed");
});

countDown("countdown2", 50);