title: how to add class 'ui-btn-active 'on li tag in jquery mobile at runtime
body: <p>i am using jQuery Mobile Navigation Tabs. i take a common footer for all pages like footer.html, and load this footer on a footer div at run time. this is working good as i want. </p>
  
  <p>here is my code of footer.html</p>
  
  <pre><code>&lt;div data-role="footer" data-id="foo1" data-position="fixed"&gt;
  &lt;div data-role="navbar"&gt;
          &lt;ul id="footertab"&gt;
  
              &lt;li id="home"&gt;&lt;a href="#page1" data-transition="none"   data-icon="tab-home"  &gt;&lt;/span&gt;Home&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="#page2" data-transition="none"  data-icon="tab-alert"   &gt;&lt;span   class="count"&gt;6&lt;/span&gt;Alerts&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="#page3" data-transition="none" data-icon="tab-services" &gt;Services&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="#page4" data-transition="none"  data-icon="tab-learn"&gt;Learn&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="#page5" data-transition="none" data-icon="tab-setting"&gt;Settings&lt;/a&gt;&lt;/li&gt;  
          &lt;/ul&gt;
  
  
      &lt;/div&gt;&lt;!-- /navbar --&gt;
  &lt;/div&gt;&lt;!-- /footer --&gt;
  
  &lt;/div&gt;&lt;!-- /page --&gt;
  </code></pre>
  
  <p>And i add this footer on run time using this code.</p>
  
  <pre><code>$(document).on('pageinit', function(event){
    $(".addfooter").load('footer.html', function(){
    $(this).trigger("create");
  
    });
  
  });
  </code></pre>
  
  <p>this running fine. but i have some issue with this code.it does not show the active tab. 
  i know that i have to add class='ui-btn-active ui-state-persist' in my selected tab. 
  but i do not sure that how to add and replace it with java script. 
  i dont want to use to write this footer at all pages. </p>
  
  <p>for this task i use this code in side my script</p>
  
  <pre><code>$(document).delegate('[data-role="navbar"] a', 'click', function () {
      alert("calling tab click");
      $(this).addClass('ui-btn-active ui-state-persist');
  
  });
  </code></pre>
  
  <p>This function call every time when i click any tab. but it does show selected tab. 
  all tabs are deselected. 
  How  can i solve this problem.
  please suggest me</p>