Commas appearing in html after array mapping

Viewed 118

I have made a map of an array that take the value of it to show a corresponding image. Everything works fine except for the fact some commas are appearing between those lines.

Example

I have tried to convert the array to string and remove the commas, but then the mapping stops working for a reason I can't truly understand.

Right now mapping goes like:

  const images = imgArr.map(n => `<p><img src="img/test/${n}.png" style="width: 100px; min-width: 500px; image-rendering: crisp-edges;" /> </p>`)
  var h = document.getElementById("myH2");
  h.insertAdjacentHTML("afterend", images);

Any idea how can I proceed with this?

1 Answers

Use the .join('') method on array, to convert to a string without the commas

...  
h.insertAdjacentHTML("afterend", images.join(''));
Related