jquery div when all images loaded

Question

I can load an image when it is loaded, by doing:

Answer 1

<div> elements don't load, images do. You want to listen for when the image loads, and then get the <div> and show it.

Answer 2

As @Kolink said, divs don't load. This code will show the div when all the images inside the div have loaded. (untested)

var $images = $('div img');
var loaded_images_count = 0;

$images.load(function(){
    loaded_images_count++;

    if (loaded_images_count == $images.length) {
        $("div").show();
    }
});

Answer 3

I know its too late to answer this question but for anyone viewing this thread, there is a simple and easy to use jQuery plugin with lots of other tricks to do the job. You can check it out here. then for checking all image load, you just need to do this

$('#container').imagesLoaded()
  .always( function( instance ) {
    console.log('all images loaded');
  })