[SOLVED] How does one use the onerror attribute of an img element

How does one use the onerror attribute of an img element

.posting-logo-div {}

.posting-logo-img {
  height: 120px;
  width: 120px;
}

.posting-photo-div {
  height: 5px;
  width: 5px;
  position: relative;
  top: -140px;
  left: 648px;
}

.posting-photo-img {
  height: 240px;
  width: 240px;
}

<div id="image" class="posting-logo-div">
  <img src="../images/some-logo1.jpg" onerror="this.src='../images/no-logo-120.jpg';" class="posting-logo-img" />
</div>
<div id="photo" class="posting-photo-div">
  <img src="../images/some-logo2.jpg" onerror="this.src='../images/no-logo-240.jpg';" class="posting-photo-img" />
</div>

This doesn't seem to work in Chrome or Mozilla but does work in IE.

Solution

This works:

<img src="invalid_link" onerror="this.onerror=null;this.src='https://placehold.co/400x300';">

As Nikola pointed out in the comment below, in case the backup URL is invalid as well, some browsers will trigger the "error" event again which will result in an infinite loop. We can guard against this by simply nullifying the "error" handler via this.onerror=null;.