JSFiddle - React, Tailwind, and code Playground

by Lena R

HTML

<div class = "minute"></div>
<div class = "second"></div>

CSS

.minute{
height:100px;
width:100px;
background:#6700ff;
color: yellow;
font-size: 25pt;
float:left;
}
.second{
height:100px;
width:100px;
background:#6700ff;
color: yellow;
font-size: 25pt;
float:left;
}

JavaScript

function minute(){
var timer = document.querySelector('.minute');
window.timer = setInterval(function(){
var now = (new Date()).getMinutes();
var finish =59 -(new Date()).getMinutes();
now--;
if(now === 0) clearInterval(timer);
timer.innerHTML = finish;
});
}
minute();	
	
function second(){
var timer = document.querySelector('.second');
window.timer = setInterval(function(){
var now = (new Date()).getSeconds();
var finish = 59 - (new Date()).getSeconds();
now--;
timer.innerHTML = finish;
});
}
second();