JS ForEach Loops in IE11

Question

I am having issues getting a JS loop to work over 4 elements on a page in IE11. I want the function hideImg to run on mouseover on the element that you hovered over.

Here is my code:

elements.forEach( function(element) {     element.addEventListener('mouseover', hideImg); }); 

I think I've found that forEach loops are not supported in IE, how can I easily convert this to a for loop in plain JS?

Kind regards,
Steve

Answer 1

You can do it like this:

var elements = document.getElementsByClassName("test");  for (var i = 0; i < elements.length; i++) {    elements[i].addEventListener('mouseover', hideImg);  }    function hideImg() {    console.log("hideImg called")  }

.test {    width: 40px;    height: 20px;    border: green solid 1px;  }

<div class="test"></div>  <div class="test"></div>  <div class="test"></div>  <div class="test"></div>

Answer 2

This code will fix your issue in IE 11.

Array.prototype.slice.call(elements).forEach( function(element) {     element.addEventListener('mouseover', hideImg); });