Untitled

<html>
<head>
<!-- HERE YOU CAN ADD ALL YOUR INCLUDES -->
<head>
<body>

<!-- This page will show first -->
<div data-role="page" id="index">

    <div data-role="header" data-position="inline" id="indexheader" >
        <h1>Page 1 Heading</h1>
    </div><!-- /header -->

    <div data-role="content">
        <h3>page Content</h3>
    </div><!-- /content -->

    <div data-role="footer"  data-position="fixed">
    <h3>Footer Text</h3>
    </div><!-- /footer -->

<!-- SECOND PAGE -->
<div data-role="page" id="pagetwo">

    <div data-role="header" data-position="inline" id="page2header" >
        <h1>Page 2 Heading</h1>
    </div><!-- /header -->

    <div data-role="content">
        <h3>page Content</h3>
    </div><!-- /content -->

    <div data-role="footer"  data-position="fixed">
    <h3>Footer Text</h3>
    </div>

<!-- THRIRD PAGE -->
<div data-role="page" id="pagethree">

    <div data-role="header" data-position="inline" id="page3header" >
        <h1>Page 3 Heading</h1>
    </div><!-- /header -->

    <div data-role="content">
        <h3>page Content</h3>
    </div><!-- /content -->

    <div data-role="footer"  data-position="fixed">
    <h3>Footer Text</h3>
    </div>
</div>
</body>
</html>

$.mobile.changePage($('#pagetwo')); /*page navigation the particular where data shown*/
$("#index").trigger("pagecreate"); /*This is like a page refresh in jquery*/