JSFiddle - React, Tailwind, and code Playground

by Philippe Xantus

HTML

<p class="clock">
    <span id="minutes">00</span>:
    <span id="seconds">00</span>:
    <span id="hundredths">00</span>
</p>

JavaScript

var seconds = 0;
var minutes = 0;
var hundredths = 0;
var boolean = 0;
var counter = 0;
$(document).keyup(function(e) {
  if(e.which == 32) {
    if(boolean == 0)
    {
        boolean = 1;
        $("#test").html("started " + boolean);
        
        counter = setInterval(function(){
            hundredths++;     
            if(hundredths == 100)
            {
                hundredths=0;
                seconds +=1;
            }
            if(seconds == 60)
            {
                seconds = 0;
                minutes +=1;
            }
            $("#hundredths").html(("0" + hundredths).slice(-2));
            $("#minutes").html(("0" + minutes).slice(-2));
            $("#seconds").html(("0" + seconds).slice(-2));
        }, 10);
    } else {
        boolean = 0;
        $("#test").html("stopped " + boolean);
        clearInterval(counter);
        counter=0;
    }
  }
});

$(".click").on("click",function(){
    clearInterval(counter);
});