JSFiddle - React, Tailwind, and code Playground
HTML
<img src="https://www.google.com.br/images/srpr/logo11w.png" width="80" />
<img src="http://www.google.com/x.jpg" />
<br>
<img src="http://i.imgur.com/k2Pn7US.png?x=65465465" /><br>
<br>
<button>Adicionar img</button>
<br>
CSS
.failToLoad {
border: 5px solid red;
}
JavaScript
var hasError = function(node)
{
return node.complete && !node.naturalWidth;
};
var observer = new MutationObserver(
function(mutations)
{
for (var m in mutations)
{
var mutation = mutations[m];
if (mutation.addedNodes)
{
for (var i = 0; i < mutation.addedNodes.length; ++i)
{
var node = mutation.addedNodes[i];
if (node.nodeName == "IMG")
{
node.addEventListener("error", function() {
node.className += " failToLoad";
}, false);
}
}
}
}
}
);
observer.observe(document, { childList: true, subtree: true });
$(function() {
$("img").each(function(i,e) {
e.addEventListener("error", function(imgEvents) {
var img = e;
e.className += " failToLoad";
}, false);
});
});
// evento do botão
$(document).delegate("button", "click", function() {
$("<img>")
.attr("src", "http://i.imgur.com/k2Pn7US.png?c=" + Math.random())
.appendTo("body");
$("<img>")
.attr("src", "https://www.google.com.br/images/srpr/x.png")
.appendTo("body");
});