Comment utiliser les barres de navigation comme onglets dans jquery mobile

Question

C'est le code suivant que j'ai essayé avec FiddleCode Jsfiddle

<div data-role="navbar">
<ul>
    <li><a href="#tab-1">Tab1</a></li>
    <li><a href="#tab-2">Tab2</a></li>
    <li><a href="#tab-3">Tab3</a></li>
</ul>
</div>

<div data-role="content">
    <div id="tab-1">
       <h2>Here is the first tab</h2>
    </div>

    <div id="tab-2">
        <h2>Here is the second tab</h2>
    </div>
    <div id="tab-3">
        <h2>Here is the third tab</h2>
    </div>
</div>

1. Je dois afficher le premier onglet et son contenu par défaut
2. Je dois masquer le contenu d'un autre onglet lorsqu'un onglet particulier est affiché

Comment faire?

​