title: Detect which tab is selected with jquery
body: <p>I am using <a href="http://materializecss.com/" rel="nofollow noreferrer">materializecss</a> to create tabs. So I am at point where I want to detect which tab is opened and then configure the UI using Javascript or Jquery.</p>
  
  <p>E.g</p>
  
  <pre><code> if (tab.index == 0 || 'brands'){
     //Configure some UI
  }else if(tab.index == 1 || 'products'){
    //Configure some UI
  }
  </code></pre>
  
  <p>The HTML part looks like this:</p>
  
  <pre><code>&lt;ul class="tabs blue-grey darken-2"&gt;
      &lt;li class="tab col s6"&gt;&lt;a class="active" href="#brands" style="color: white;"&gt;Brands&lt;/a&gt;&lt;/li&gt;
      &lt;li class="tab col s6"&gt;&lt;a style="color: white;" href="#products"&gt;Products&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>I already did manually change tab on button click like this:</p>
  
  <pre><code>$('ul.tabs').tabs('select_tab', 'products');
  </code></pre>
  
  <p>but do not know how to achieve the question part. I hope to get some help :) I went through many similar questions but didn't find solution. If the question is somehow dublicate please comment.</p>