How to define multiple pages within one single HTML file

<div data-role="page" id="main-page">
    <div data-role="header">
        //Content
    </div>
    <div data-role="content">
        //Content
    </div>
    <div data-role="footer">
        //Content
    </div>
</div>
<div data-role="page" id="subpage-1">
    <div data-role="header">
        //Content
    </div>
    <div data-role="content">
        //Content
    </div>
    <div data-role="footer">
        //Content
    </div>
</div>