Custom youtube api progressbar

I looked at this question from 2014 which shows a demo of a custom youtube progressbar. I made the progressbar work on my page aswell. However in my case once a video finshed playing another one is queued. Then my progressbar goes crazy sometimes cause I think it still remembers the last song sometimes (im a bit unsure why). See my gif

function progress(percent, $element) {
    var progressBarWidth = percent * $element.width() / 100;
    $element.find('div').animate({ width: progressBarWidth });
}
let mytimer = 0;
function onPlayerStateChange(event) {
     if (event.data == YT.PlayerState.PLAYING) {
     playing = true;
     var playerTotalTime = player.getDuration();
     mytimer = setInterval(function() {
        var playerCurrentTime = player.getCurrentTime();
        var playerTimeDifference = (playerCurrentTime / playerTotalTime) * 100;
        progress(playerTimeDifference, $('#progressBar'));
      }, 1000);   
}
else if(event.data == YT.PlayerState.PAUSED){
        playing = false;
}
else {
  clearTimeout(mytimer);
}

A bit further down in the code:

if (event.data == YT.PlayerState.ENDED){
    player.current_video++;
    clearTimeout(mytimer);
    playVideo();
}

So here I added clearTimeout(mytimer) to clear the timer, but I guess it doesn’t work, anyone who knows why?