Pjax seamless replace not changing slides

Hey!

I’ve used pjax’s seamless replace code multiple times on my site and never had an issue until now. My company utilizes case studies from past clients to bring in leads and explain in more detail what users can do with our product. We use a CMS list for these and I’ve built out a paginated slider that I’ve copy and pasted 3 places on my site. While 2 out of the three of these work exactly as expected the one linked below seems to only work on the designer preview, once published (see staging URL) the pagination seems to not be able to update, and the next slide isn’t shown. Hoping for some assistance and insight into what might be going on here?


Here is my public share link: LINK

Here is my staging URL: LINK

UPDATE: I’ve added a page refresh to my pjax code:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.pjax/2.0.1/jquery.pjax.min.js"></script>
<script>
  var containerSelector = '#seamless-replace';
  $(document).pjax(
    '.w-pagination-wrapper a',
    containerSelector,
    {
      container: containerSelector, 
      fragment: containerSelector,
      scrollTo: false,
      timeout: 2500,
    }
  );

  // These 3 lines should reinitialize interactions
    $(document).on('pjax:end', function() {
    Webflow.require('ix2').init();
    location.reload();
  });

With a refresh the pagination seems to work, however it starts at the top of the page and cuts down after about a half a second. So it’s… working… but not very smoothly. To reiterate the other two CMS lists on my site work fine without the need for a page refresh everytime someone tries to click to the next tab so still looking for a reason why my third CMS list needs to be refreshed in order to display the next tab.

Here is a link to the page with a working paginated list, a bit hard to tell with the new code I’ve implemented but you should be able to see the tab switch occur before the page is reloaded, vs with the former link (above post) the tab won’t switch until after the refresh