When the requested page loads, jQuery Mobile parses the document for an element with the data-role="page" 

However, when I look at the source-code for the current demo ( http://demos.jquerymobile.com/1.4.5/) I can see that the menu panel on the left is a contained within the main page div, as are pretty-much all other DOM elements on the page. Ordinarily I would take this as meaning that navigating to one of the child pages should cause an entire refresh, but in practice this does not happen: the menus stay as they are and only the content appears to change.

Am I to infer from this that the demo is doing the AJAX loads of child content pages in javascript instead of relying on the default navigation described in the documentation? I tried including the relevant javascript file in my test project but again, the entire page refreshes whenever I try to navigate to a child page.

Dynamic content loading seems like a pretty fundamental part of jQuery Mobile, am I missing something obvious?

UPDATE:

I've attached the two html files in my minimal example (I've had to give them a txt extension), they link directly to the source files in the jQuery mobile demo and thus should load fine standalone. My desired behaviour is to load the first file (First.html) and navigate to the second without seeing a full page refresh. This is basically just the main jQuery Mobile demo source saved from within the browser...which I suspect might be the cause of the problem itself due to the fact that the index.js file seems to be munging the source code.