title: How do I prevent default tab switching functionality in JQuery?
body: <p>I have created the tabs below.</p>
  
  <pre><code>&lt;ul class="idTabs"&gt;
  &lt;li&gt;&lt;a href="#basic_info" id="basic_info_link" &gt;Personal&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="#add_info" id="add_info_link"&gt;Address&lt;/a&gt;&lt;/li&gt;
  &lt;li style="width:194px;"&gt;&lt;a href="#payment_info" id="payment_link" style="border-left:none;width:194px;"&gt;Bank&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  &lt;div id="basic_info"&gt;&lt;!--HTML Code --&gt;&lt;/div&gt;
  &lt;div id="add_info"&gt;&lt;!--HTML Code --&gt;&lt;/div&gt;
  &lt;div id="payment_info"&gt;&lt;!--HTML Code --&gt;&lt;/div&gt;
  </code></pre>
  
  <p>The tabs work fine, but the problem is that on clicking these tabs heading I want to prevent to go to next tab.</p>