Use jQuery after loading new data

Use jQuery after loading new data

I'm using infinite scroll, one that I wrote, to load new data on scroll. The data that loads is a list that I need to be able to recognize with a .hover event.

--> $(".tagItem").hover(function () { ... }

But the new data with the tagItem attribute are not recognized by the hover event.

How can I have the new data be recognized by jQuery events???

This is my infinite scroll... it works just fine. After the new data is loaded, I am unable to use jQuery hover on it.

  3.     function InfiniteScroll() {
  4.     //$('#divPostsLoader').html('<img src="http://i.imgur.com/6RMhx.gif">');
  5.     var $updatedboxes;
  6.     var itemcount = $(".masonryContainer > div").length + 1;
  7.     var daycycle = getParameterByName("d");

  9.     //alert(itemcount);
  10.     //send a query to server side to present new content
  11.     $.ajax({
  12.     type: "POST",
  13.     url: "xxxx",
  14.     data: "{itemIndex:'" + itemcount + "', dayCycleId:'" + daycycle + "'}",
  15.     contentType: "application/json; charset=utf-8",
  16.     dataType: "json",
  17.     success: function (data) {
  18.     if (data != "") {
  19.     $appendedDivs = $(data.d).css({ opacity: 0 });
  20.     $appendedDivs.imagesLoaded(function () {
  21.     // show elems now they're ready
  22.     $appendedDivs.animate({ opacity: 1 });
  23.     $('#masonryContainer').append($appendedDivs);
  24.     $('#masonryContainer').masonry('appended', $appendedDivs, true);
  25.     });
  26.     }
  27.     //$('#divPostsLoader').empty();
  28.     }
  29.     })
  30.     };