This is the stopwatch I made but the start button is not working - it doesn't actually start the stopwatch.
I've tried to find solutions on the internet but I haven't been able to find anything.
var seconds = 00;
var tens = 00;
var appendTens = document.getElementsByClassName("tens");
var appendSeconds = document.getElementsByClassName("seconds");
var buttonStart = document.getElementById("btn-start");
var buttonStop = document.getElementById("btn-stop");
var buttonReset = document.getElementById("btn-reset");
var interval;
function startTimer() {
tens++;
if (tens < 9) {
appendTens.innerHTML ="0" + tens;
}
if (tens > 9) {
appendTens.innerHTML = tens;
}
if (tens > 99) {
seconds++;
appendSeconds.innerHTML = "0" + seconds;
tens = 0;
appendTens.innerHTML = "0" + 0;
}
if (seconds > 9) {
appendSeconds.innerHTML = seconds;
}
};
buttonStart.onclick = function() {
interval = setInterval(startTimer);
}
buttonStop.onclick = function() {
clearInterval(startTimer);
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="stopwatch.css">
<title>StopWatch</title>
</head>
<body>
<div class="container">
<img src="/iconmonstr-clock-thin.svg" alt="">
<h2>StopWatch</h2>
<p><span class="seconds">00</span>: <span class="tens">00</span></p>
<button class="btn" id="btn-start">Start</button>
<button class="btn" id="btn-stop">Stop</button>
<button class="btn" id="btn-reset">Reset</button>
</div>
<script src="stopwatch.js" type="application/javascript"></script>
</body>
</html>