const pictureChange = document.querySelectorAll('.image-to-show')
function pictureReplacement(array, duration, indexElement){
let timer = setInterval(() => {
const item = array[indexElement]
console.log(item)
indexElement++
if (indexElement >= array.length) {
clearInterval(timer)
}
}, duration);
}
pictureReplacement(pictureChange, 500, 0)
<div class="images-wrapper">
<img src="./banners/img/1.jpg" alt="image of game" class="image-to-show" />
<img src="./banners/img/2.jpg" alt="image of game" class="image-to-show" />
<img src="./banners/img/3.JPG" alt="image of game" class="image-to-show" />
<img src="./banners/img/4.png" alt="image of game" class="image-to-show" />
</div>