title: Navigate to page that is inside div tag in JQuery Mobile
body: <p>Following are the <code>J Query-Mobile</code> single page structure containing 3 pages first page is immediate child of body tag while other two pages are grand child of body tag so when page load in <code>DOM</code> browser shows the first page now I want to link other pages with main page but they can't show and if remove the parent <code>div</code> of 2nd and 3rd page then works fine but i want to place these page into separate <code>div</code> its my app requirement is there any possible way to call these pages</p>
  
  <pre><code>&lt;body&gt;
  &lt;div data-role="page" id="mainPage"&gt;
      &lt;div data-role="content"&gt;
          &lt;a data-role="button"&gt;SubPage1&lt;/a&gt;    &lt;!--&lt;a href="#subPage1" data-role="button"&gt;SubPage1&lt;/a&gt; I write this but not show other page what value should href have --&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;div&gt;
      &lt;div data-role="page" id="subPage1"&gt;
          &lt;div data-role="content"&gt;
              &lt;a href="#subPage2" data-role="button"&gt;SubPage2&lt;/a&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div data-role="page" id="subPage2"&gt;
          &lt;div data-role="content"&gt;
              &lt;a data-role="button"&gt;Main Page&lt;/a&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;/body&gt;
  </code></pre>