JQuery script not working on divs fetched after page load

So I have the jquery code here:

$(document).ready(function(){
    $("div.post.photo").hover(function () {
        $(this).children("div.show").slideToggle("fast");
    });
});

It effects the html code开发者_Python百科 here:

<div class="post photo">
    <img src="source" />
    <div class="show">
        <div class="caption">
        Caption
        </div>
    </div>
</div>

However as you scroll down the page, more div's are fetched via another script (not written by me), but the above jquery script doesn't affect them.

Thoughts?

---

You'll need to use jQuery's .live() handler - http://api.jquery.com/live/

"Attach a handler to the event for all elements which match the current selector, now and in the future."

eg.

$("div.post.photo").live('hover', function() {
    $(this).children("div.show").slideToggle("fast");
});