.innerHtml is not working when slider reaches the certain point

[Vinayshetty55]

var swiper = new Swiper(".slide-content", {
slidesPerView: 3,
spaceBetween: 25,
// slidesPerGroup: 3,
loop: true,
centerSlide: 'true',
fade: 'true',
gragCursor: true,
loopFillGroupWithBlank: true,
speed: 1000,
autoplay:{
delay: 2000,
},
pagination: {
el: ".swiper-pagination",
clickable: true,
dynamicBullets: true,
},
navigation: {
nextEl: ".swiper-button-next",
prevEl: ".swiper-button-prev",
},
breakpoints:{
0: {
slidesPerView: 1,
},
520: {
slidesPerView: 2,
},
950: {
slidesPerView: 3,
},
},
});
let joh;
let joh_option = { timeZone:'Africa/Johannesburg', hour12: false, year: 'numeric', month: 'numeric', day: 'numeric', hour: 'numeric', minute: 'numeric',second: 'numeric' };
let formatter_joh;
setInterval(()=> {
joh = new Date();
formatter_joh = new Intl.DateTimeFormat('en-GB',joh_option).format(joh);
document.getElementById('time_joh').innerHTML = formatter_joh + "
";
},1000);

let swi;
let swi_option = { timeZone:'Europe/Zurich', hour12: false, year: 'numeric', month: 'numeric', day: 'numeric', hour: 'numeric', minute: 'numeric' ,second: 'numeric'};
let formatter_swi;
setInterval(()=> {
swi = new Date();
formatter_swi = new Intl.DateTimeFormat('en-GB',swi_option).format(swi);
document.getElementById('time_swi').innerHTML = formatter_swi + "
";
},1000);

let isr;
let isr_option = { timeZone:'Asia/Jerusalem', hour12: false, year: 'numeric', month: 'numeric' ,day: 'numeric', hour: 'numeric', minute: 'numeric',second: 'numeric'};
let formatter_isr;
setInterval(()=> {
isr = new Date();
formatter_isr = new Intl.DateTimeFormat('en-GB',isr_option).format(isr);
document.getElementById('time_isr').innerHTML = formatter_isr + "
";
},1000);