I am using the code below to load a resource via AJAX that contains a <ul id=" photoCollection" > . That list has an image in each of its <li> tags. This markup and images are getting loaded as expected into the target Div #photoCollectionWrapper. 

Once the images are loaded into the target div with AJAX I need to select them so I can alter their widths and heights. So far, I have been unable to select them as expected once they are loaded. However, If I just load them in a new page with NO AJAX, then buy using a simple .load() event handler I am able to select them after they have completely loaded as expected. No problem.

But when loading the resource via AJAX I am unable to select them at all. I am using a callback that gets fired after the AJAX is loaded. Then in there it seems "logical" to call my .load() handler on the images loaded in via AJAX. Here's a sample of some code just to illustrate the idea. The code below actually will not run at all. If I remove the .load() bit it will, but then Alert always returns null. 

function photosLoaded() {

    alert($('#photoCollection li img').height());

  }

}

I have also tried many css selector variations to try and select the target images, but to no avail. I know for sure photosLoaded() is getting called. I just can't select the elements that the AJAX call brought in.

Any idea how to solve this?

Thanks a ton!