When I try to run my code I get the error message in the console :
(index):37 Uncaught TypeError: Cannot read property 'addEventListener' of undefined
I saw many post with the same error message for something similar but it didn't helped me
let thumbnails = document.getElementsByClassName('thumbnail')
let activeimages = document.getElementsByClassName('thumbnail-active')
for (var i = 0; i <= thumbnails.length; i++) {
thumbnails[i].addEventListener('mouseover', function() {
if (activeimages.length > 0) {
activeimages[0].classList.remove('thumbnail-active')
}
this.classList.add('thumbnail-active')
document.getElementById('featured').src = this.src
})
}
<div class="slideshow">
<div class="displayImage">
<img id="featured" src="./style/image1.jpg">
</div>
<div class="row slide-wrapper">
<div class="arrow" id="prev"></div>
<div id="slider">
<img class="thumbnail thumbnail-active" src="./style/image1.jpg">
<img class="thumbnail" src="./style/image2.jpg">
<img class="thumbnail" src="./style/image3.jpg">
<img class="thumbnail" src="./style/image4.jpg">
<img class="thumbnail" src="./style/image5.jpg">
</div>
<div class="arrow" id="next"></div>
</div>
</div>