isotope.javascript.js

isotope.javascript.js

jQuery(document).ready( function() {
  
  var $grid = jQuery('.grid').isotope({
    itemSelector: '.grid-item',
    layoutMode: 'fitRows',
    getSortData: {
     title: '.title',
     date: '.date'
    }
  })
  
  jQuery('.category').each( function() {
    
    jQuery(this).closest('.grid-item').addClass(jQuery(this).text().toLowerCase());
    jQuery(this).remove();
    
  })
  
  jQuery('[data-filter]').click( function(e) {
    
    e.preventDefault();
    
    $grid.isotope({ filter: jQuery(this).data('filter') })
    
  })
  
  jQuery('[data-sortby]').click( function(e) {
    
    e.preventDefault();
    
    $grid.isotope({ sortBy: jQuery(this).data('sortby') })
    
  })
  
})

I am using this for an oxygen repeater which has infinite scroll as well.
The items visible on the page are correctly being assigned their category as CSS class, but all the items loaded when scrolling the page, are not.
What could be the issue?

Thanks!