Class being added to only one loop (PHP) element

Question

I’ve been developing a system for a while and in it I was implementing the LAZY LOAD, that famous technique of loading images that are only loaded when the user scrolls the page to where they are.

I chose to API Intersection Observer, only that some versions of IE do not support it; thinking about it, I decided to create a check to appear a message if the browser does not support, so far okay, I managed with the following code below:

if ("IntersectionObserver" in window === false){
    $("#image-load").append("<p class='p_um no-img'>Seu navegador não 
suporta a API, atualize a versão ou tente acessar com outro. </p>");
}

This code creates a new div within the container #image-load with the message he wanted (this container #image-load is in a loop loop, every image I have on WHILE also come out with this container - Code below). The problem is that my images are in a loop on PHP and the code is only working on the first element of WHILE.

I broke my head and got nothing else. It follows below the way being printed the while in the HTML.

<div class="cover-det" id="image-load">
     <img data-src="img-1.jpg">
     <p class='p_um no-img'>Seu navegador não suporta a API, atualize a versão ou tente acessar com outro.    
     </p>
</div>

<div class="cover-det" id="image-load">
     <img data-src="img-2.jpg">
</div>

<div class="cover-det" id="image-load">
     <img data-src="img-3.jpg">
</div>

And so it goes...

My question is as follows: How to make this message be played in all the images of this mine while in the PHP?