javascript - Executing infinite scroll on dynamically created content -

i have page load content using mysql database. , users can filter content using few buttons , content replaced dynamically pulled data using jquery. link use in infinite scroll change. infinite scroll plugin seems take same old link , not newly loaded link trigger scroll.

jquery infinity scroll plugin use

https://cdnjs.cloudflare.com/ajax/libs/jquery-infinitescroll/2.1.0/jquery.infinitescroll.js

this code

<div class="container" id="myposts"> <div class=”post”> <p>my content</p> </div> </div>  <nav id="page-nav"><a href="myposts.php?page=2"></a></nav>  //jquery code $('#myposts').infinitescroll({     navselector  : '#page-nav',    // selector paged navigation          nextselector : '#page-nav a',  // selector next link (to page 2)         itemselector : '. post ',     //         loading: {                         finishedmsg: 'end of page',                         img: 'images/loader.gif'     }     }, function(newelements, data, url){  }); 

i’m changing scroll trigger link from

<nav id="page-nav"><a href="myposts.php?page=2"></a></nav> 

to

<nav id="page-nav"><a href="getposts.php?page=2"></a></nav> 

but plugin still take old link trigger scroll. there solution this? appreciate time.

you listen append.infinitescroll event , update link page.
https://infinite-scroll.com/events.html#append
https://infinite-scroll.com/api.html#option

something this:

$container.on( 'append.infinitescroll', function( event, response, path, items ) {   $container.infinitescroll( 'nextselector', '#page-nav a' ) });