Eu uso o AJAX para exibir o conteúdo da página B na página A.

Como posso fazer o jQuery esperar que tudo seja carregado (texto, imagens etc.) antes que o conteúdo seja exibido?

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

Eu uso beforeSend para mostrar uma animação de carregamento para o usuário quando a solicitação AJAX está sendo processada. Agora quero "estender" o tempo de espera para que a animação de carregamento não desapareça até que todas as imagens sejam carregadas.

Tentei ocultar inicialmente os dados anexados, esperar que todas as imagens sejam carregadas e, em seguida, mostrar conteúdo -$("body").on("load", "images class here", function() {//show content}) dentrosuccess mas o evento não parece disparar.

Alguma ideia?

ATUALIZAR:

Código atualizado:

$.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});
    }
});