Based on scroll (infinite load) contents gets appended to the DOM via AJAX. Let's say user loaded 20 pages of content (100 new posts if we say 5 posts per page); we can say we have 100 more posts compared to original DOM that only contains 1st page with 5 posts.

But when user clicks to a link and changes the URL and after that if he wants to go back with browser's back button; AJAX loaded content gets deleted by browser IN CHROME and this affects the user experience badly.

In Safari, Firefox and Opera AJAX loaded data is not getting removed from original DOM.

How can I handle AJAX loaded data on page change and using back button?

Thanks!