way to reinitialize a page each time it is shown

I have some pages which are filled dynamically by content loaded with Ajax. My problem is that each time I go to this page, the old content is still there if it hasn't been replaced by new content...

I've t开发者_C百科hought about 2 home solutions like:

• Creating a "template" page. By calling "pagebeforeshow", I'll copy the code from the template in the target page, and add there the dynamic content...
• Each DOM where dynamic content must be put into, I had a class "clearcache" and by calling "pagebeforeshow" I do a $(".clearcache").empty();

I don't know how to deal with that. Have you ever got the same issue?

EDIT:

<a href="#PageBlock" data-ajax="false" block-id="5" data-transition="flip"></a>

I bind the "tap" event to store the block-id into localstorage, to load dynamic content in the #PageBlock Everything works very well (tap event, localstorage for the var, ajax loading). The issue comes really when I go from block to other blocks. The new content overwrite old content instead of beginning from a new "blank" page.

For example I have a list where I append datas I get from Ajax. If I switch to another block, the list is completed and not refreshed..

I could do something like empty the list, and then appending content, but I'd like something better because I have several pages/lists/dom like that...

Thanks for your help ;)

I faced a similar problem where the new contents where not shown on the page when i tried to append it.There is a simple solution where you can just replace append with prepend. Example: Replace $("#divid").append(content) with $("#divid") .prepend(content)