Я новичок в jQuery Mobile и у меня проблемы с пониманием повторного использования заголовка и общей навигации.

Итак, я создал заголовок, который имеет кнопку меню справа. При нажатии на эту строку меню появляется всплывающее окно со ссылками на другие страницы:

<div data-role="header">
       <h1>Home</h1>
       <a href="#popupMenu" data-rel="popup" data-transition="slide" class="ui-btn ui-corner-all ui-shadow ui-btn-inline ui-icon-bars ui-btn-icon-right ui-btn-a">Menu</a>
           <div data-role="popup" id="popupMenu"  data-theme="a" style="top: 22px; right: -12px">
                  <ul data-role="listview" data-inset="true" style="min-width:250px; min-height: 698px;">
                      <li><a href="test1.html">Home</a></li>
                      <li><a href="test2.html">Second</a></li>
                 </ul>
           </div>
</div>

Я могу дублировать этот код на всех страницах, но из того, что я кратко прочитал, jQuery делает это для меня автоматически. Это правда. Если нет, то как мне это сделать.

Исходя из этого вопроса, когда дело доходит до навигации по страницам и повторного использования заголовков,a href стандартный способ загрузки новых страниц?

Любая помощь будет оценена.

Благодарю.