JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://raw.github.com/azicchetti/jquerymobile-router/master/js/jquery.mobile.router.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.css">
<script src="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.js"></script>
<div id="site" data-role="page" data-add-back-btn="true">
    <div data-role="header"><h1>Site</h1></div>
    <div data-role="content">
        <ul data-role="listview">
            <li><a href="#section?id=1">Section 1</a></li>
            <li><a href="#section?id=2">Section 2</a></li>
        </ul>
    </div>
</div>

<div id="section" data-role="page" data-add-back-btn="true">
    <div data-role="header"><h1>Section</h1></div>
    <div data-role="content">
        <ul data-role="listview">
             <li><a href="#chunk?id=1">Chunk 1</a></li>
        </ul>
    </div>
</div>

<div id="chunk" data-role="page" data-add-back-btn="true">
    <div data-role="header"><h1>Chunk</h1></div>
    <div data-role="content"></div>
</div>

JavaScript

var actions = {
    showSite: function(eventType, matchObj, ui, page, evt) {
        console.log('showSite');
    },
    showSection: function(eventType, matchObj, ui, page, evt) {
        console.log('showSection');
    },
    showChunk: function(eventType, matchObj, ui, page, evt) {
        console.log('showChunk');
    }
};


new $.mobile.Router(
{
    "#site": { handler: "showSite", events: "bs" },
    "#section([?].*)?": { handler: "showSection", events: "bs" },
    "#chunk([?].*)?": { handler: "showChunk", events: "bs" },
},
actions);