Jquery Masonry only works in ajax loaded content on second click -

i loading content on page using .load, , have images being displayed using masonry plugin. masonry kicking in on second click load content however. page in question photo page @ http://ashevilleapothecary.info/ here stripped down code:

$(".navpage").click(function(){     $("#floodcontent").load("photos.txt"); });  $(document).ajaxcomplete(function(){     $('#photobox').masonry({         itemselector: '.photo'     }); }); 

any appreciated thank you!

masonry doesn't know change (new images loading) since there's no callback function 'remind' masonry organize page again.

use imagesloaded plugin option. fire callback function once images loaded , images no longer overlap.

http://masonry.desandro.com/docs/intro.html#imagesloaded_plugin