How to detect the image that not load correctly/completed on web page?

How to detect the image that not load correctly on web page? I used the following jquery but not working.

$('#image1').on('load', function() {
    if ($('#image1').prop('complete')) {
        console.log("image complete: true");
    } else {
        console.log("image complete: false");
    }
}).on('error', function() {
    console.log("image loaded error");
}).attr("src", imgUrl);