Uso AJAX para mostrar el contenido de la página B en la página A.

¿Cómo puedo hacer que jQuery espere a que todo se cargue (texto, imágenes, etc.) antes de que se muestre el contenido?

$.ajax({
    url:"pageB.html",
    beforeSend: function() {
        //show loading animation here
    }
    success: function(data) {
        //hide loading animation here
        $("body").append(data);
    }
});

Utilizo beforeSend para mostrar una animación de carga al usuario cuando se está procesando la solicitud AJAX. Ahora quiero "extender" el tiempo de espera para que la animación de carga no desaparezca hasta que se carguen todas las imágenes.

Intenté ocultar inicialmente los datos adjuntos, esperar a que se carguen todas las imágenes y luego mostrar el contenido.$("body").on("load", "images class here", function() {//show content}) dentrosuccess Pero el evento no parece dispararse.

¿Algunas ideas?

ACTUALIZAR:

Código actualizado:

$.ajax({
    url:"pageB.html",
    beforeSend: function() {
        //show loading animation here
    }
    success: function(data) {
        //hide loading animation here
        $("body").append(data);
        $("body").on("onload", "img", function() {//display content});
    }
});