Stop clock function not working
I wanna create a clock that prints the current time when I click a "Start Clock" Button, and Stops it when I click "Stop clock", But my function is not working, why ? // ************** HTML ****************** // <h1 id="timer"> 00:00:00 </h1> <button id="start-clock" onclick="startTime()"> Start Clock </button> <button id="stop-time" onclick="stopTime()"> Stop Clock</button> // ************** JS code **************** // var si; var start = document.getElementById('start-clock'); var clock = document.getElementById('timer'); function startTime() { let dateObj = new Date().toLocaleTimeString(); // let hours = dateObj.getHours(); // let minutes = dateObj.getMinutes(); // let sec = dateObj.getSeconds(); // let time = ` Clock Started \n ${hours} : ${minutes} : ${sec}`; clock.innerHTML = dateObj; si = setInterval(startTime, 1000); } function stopTime() { clearInterval(si); }