Estoy trabajando en una presentación de diapositivas y estoy tratando de establecer Interval después de que se borre usando "clearInterval".

JavaScript

 var counter = 1; let intervalRef = setInterval(function() { document.getElementById('radio' + counter).checked = true; counter++; if (counter > 4) { counter = 1; } }, 5000); document.querySelectorAll(".slide_bar").forEach(item => item.addEventListener("click", function(){ clearInterval(intervalRef) console.log("Slide show stopped") }))

https://jsfiddle.net/4ygwd579/

Mi objetivo es dejar claro que el intervalo dura 10 segundos y luego la presentación de diapositivas reproduce la diapositiva SIGUIENTE.

Se agradecería si alguien puede publicar el nuevo código.