Загружая контент в div с помощью jQuery.load (), как я могу заставить новые изображения исчезать при загрузке?

Я пытаюсь добиться следующего: у меня есть div, на котором я использую метод load() для извлечения нового содержимого HTML.

 $('#mydiv').load('/newcontent.html');

Этот новый HTML также содержит изображения, и я хотел бы, чтобы эти изображения были потеряны после загрузки.

Сначала я попытался использовать функцию обратного вызова с методом load(), но эта функция запускается, как только вызывается HTML, но прежде, чем браузер загрузит все новые изображения.

Затем я попытался применить событие on ('load') на всех вновь загруженных изображениях, но это не работает вообще.

$('#mydiv').load('/newcontent.html', function() { 
    $('#mydiv img').css('visibility','hidden').on('load', function() { $(this).fadeIn(); });
});

"Видимость: скрытая" отлично работает, так что мой новый HTML-контент загружается в #mydiv, и все изображения становятся невидимыми. Но угасание в не работает. Событие, которое я пытаюсь связать здесь, фактически вызывает триггер, как только загружается новый HTML (что не имеет для меня никакого смысла), но не при загрузке отдельных изображений.

Как я могу это решить? Любая помощь ценится!