弹出窗口中的jQuery Mobile和嵌套ListView

Question

我有以下弹出窗口。

<div data-role="popup" id="popup-settings" data-transition="slideup" data-theme="c" data-corners="true" data-shadow="true" style="width: 500px; border: 1px solid #A5A5A5;">
    <div data-role="header" class="ui-corner-top" style="border-bottom: 1px solid #A5A5A5;">
        <h1>Settings</h1>
        <a href="#" data-role="button" data-inline="true" data-rel="back" data-theme="c" data-mini="true" class="ui-btn-right" style="color: #3498DB;">Done</a>
    </div>
    <div data-role="content" style="background-color: #f2f2f2; border: 1px solid #f2f2f2;">

        <ul data-role="listview" data-inset="true">
            <li style="background-color: #f2f2f2">
                <img src="icons/settingsMapping.png" /><h2>Mapping</h2><p>Set mapping framework to use.</p>
                <ul>
                    <li><h2>Slappy</h2></li>
                    <li><h2>Tappy</h2></li>
                </ul>
            </li>
            <li><a href="#"><img src="icons/settingsConnect.png" /><h2>Connection</h2><p>Connect to your Storm V4.0+ Server.</p></a></li>
            <li><a href="#"><img src="icons/settingsPasscode.png" /><h2>Passcode</h2><p>Enter your user name and password.</p></a></li>
            <li><a href="#"><img src="icons/settingsDeveloper.png" /><h2>Developer</h2><p>Developer settings.</p></a></li>
        </ul>
    </div>
</div>

显示时，嵌套的ul始终可见。

我正在做的是当你从第一个列表中选择一个列表项时，它被第二个列表替换，所有这些都在弹出窗口中。

这甚至可能吗？