I'm trying to re-create a game inspired by the minigame in New Super Mario Bros. called "Wanted!". Here's the situation:

I'm trying to have a countdown timer of 10 seconds, using JavaScript. When the timer counts down, I want the timer to refresh every second that passes. But as you'll see in the picture below, the timer writes over itself. I'm trying to do this with pure JavaScript, but HTML will also work if it is a preferred method. Keep in mind that this is a still frame. Here's what I have:

function drawTimer() {
        var timeLeft = 10; // Set seconds
        let countDown = setInterval(function() {
            // Check if we reached 0.
            if (timeLeft <= 0) {
                alert("Time's up!");
                isWinner = false;
                document.location.reload(); // reload the page
                clearInterval(countDown);
            }
            else { // Less than 10,
                requestAnimationFrame(drawTimer);
                ctx.beginPath();
                ctx.font = "16px Arial";
                ctx.fillStyle = "#FFFFFF";
                ctx.strokeStyle = "#000000";
                ctx.fillText("Time left: " + timeLeft, 200, 20);
                ctx.closePath();
            }
            timeLeft -= 1;
        }, 1000);
}

Here's what it looks like: