La función no actualiza el reloj, cómo delegar correctamente un evento, cómo solucionarlo ( https://jsfiddle.net/aod16pvj/7/ ) Lo intenté de esta manera ( https://jsfiddle.net/jde9vp0t/ ), pero se necesita delegación

 const timeInner = document.querySelector('[data-clock="time"]') let AAstr, YY, MM, DD, AA, hh, mm, ss function updateClock(date) { AAstr = ['SUN', 'MON', 'TUE', 'WED', 'THU', 'FRI', 'SAT'] YY = date.getFullYear().toString().slice(-2) MM = date.getMonth() + 1 DD = date.getDate() AA = date.getDay() hh = date.getHours() mm = date.getMinutes() ss = date.getSeconds() if (MM < 10) MM = '0' + MM if (DD < 10) DD = '0' + DD if (hh < 10) hh = '0' + hh if (mm < 10) mm = '0' + mm if (ss < 10) ss = '0' + ss } function clock() { let date = new Date() let delay = 1000 - new Date().getMilliseconds() updateClock(date) } clock() document.querySelector('.options__format').addEventListener('input', (e) => { const chk = e.target.checked const chkId = e.target.dataset.chkId const itmChk = document.querySelector(`[data-clock="${chkId}"]`) timeInner.innerHTML = `${hh} : ${mm}` itmChk.innerHTML = `` if (chk) { if (chkId == 'date') itmChk.innerHTML = `${YY} - ${MM} - ${DD}` if (chkId == 'seconds') itmChk.innerHTML = `\u00A0: ${ss}` if (chkId == 'day') itmChk.innerHTML = `\u00A0${AAstr[AA]}` } })