title: wizard bootstrap return current tab
body: <p>I implemented in my application the wizard bootstrap .</p>
  
  <p>I want to retrieve the index of the Current tab to test 
  a display or hide the buttons 'Next' 'Previous'</p>
  
  <hr>
  
  <pre><code>$('#rootwizard').bootstrapWizard({
      'nextSelector': '.button-next',
      'previousSelector': '.button-previous',
      onTabClick: function (tab, navigation, index) {
          var total = navigation.find('li').length;
  
          // here i want get the currecnt index of tab clicked 
          var current = index +1 ;
          alert();
  
          // set wizard title
          $('.step-title', $('#rootwizard')).text('Step ' + (index) + ' of ' + total);
  
          // set done steps
          jQuery('li', $('#rootwizard')).removeClass("done");
          var li_list = navigation.find('li');
  
          for (var i = 0; i &lt; index; i++) {
               jQuery(li_list[i]).addClass("done");
          }
          if (current == 1) {
              $('#rootwizard').find('.button-previous').hide();
          } else {
              $('#rootwizard').find('.button-previous').show();
          }
          if (current &gt;= 13) {
              $('#rootwizard').find('.button-next').hide();
              $('#rootwizard').find('.button-submit').show();
          } else {
              $('#rootwizard').find('.button-next').show();
              $('#rootwizard').find('.button-submit').hide();
          }
          App.scrollTo($('.page-title'));
  </code></pre>
  
  <p>The HTML:   </p>
  
  <pre><code>&lt;ul class="nav nav-tabs"&gt;                               
      &lt;li class=" active" id="dbt"&gt;&lt;a href="#portlet_tab1" data-toggle="tab"&gt;aaa&lt;/a&gt;&lt;/li&gt;
      &lt;li class=""&gt;&lt;a href="#portlet_tab2" data-toggle="tab"&gt;   bbb   &lt;/a&gt;&lt;/li&gt;
      &lt;li class=""&gt;&lt;a href="#portlet_tab3" data-toggle="tab"&gt;   ccc   &lt;/a&gt;&lt;/li&gt;
      &lt;li class=""&gt;&lt;a href="#portlet_tab4" data-toggle="tab"&gt;    dddd    &lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>