How to remove img tag whose img not loaded

Question

I have two img tag. One with invalid src and other with valid src. Invalid one decreses in height if image don't load. I want to target such images from stack whose images not loaded and show alt text and set them to display none using javascript.

Here is my try but not working well.
Plz suggest any idea 💡 if you have??

https://code.sololearn.com/WNCjemUgMI8F/?ref=app

Answer 1

https://code.sololearn.com/WNCjemUgMI8F/?ref=app

Answer 2

SoundInfinity

I use it as

img.onerror = ()=>{
img.style.display = "none"
}

But 😒 it didn't work

Answer 3

You didn't even post ur try, but okay. Anyways, you can use 'img.onerror' which I think fires when the image fails to load.

Answer 4

I'm pretty sure the image must be reloaded after assigning that event, so it can fire it.

Answer 5

I think this might work. Add the attribute, "onerror", directly to the image element, like so: <img onerror='this.remove()'></img>

That will remove the image in case it fails to load.