Simple way to navigate through bootstrap nav pills
<p>I have a bootstrap nav pills <a href="https://jsfiddle.net/mpsbhat/nq0uxgqx/" rel="nofollow">sample here</a> drawn as,</p>

<pre><code>&lt;ul class="nav nav-pills nav-stacked"&gt;
        &lt;li class="active"&gt;&lt;a data-toggle="pill" href="#sec1"&gt;&lt;b&gt;Section 1&lt;/b&gt;&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a data-toggle="pill" href="#sec2"&gt;&lt;b&gt;Section 2&lt;/b&gt;&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a data-toggle="pill" href="#sec3"&gt;&lt;b&gt;Section 3&lt;/b&gt;&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
</code></pre>

<p>I can go to next tab once user clicks on next button inside the tab content by using jquery as <a href="https://jsfiddle.net/mpsbhat/nq0uxgqx/1/" rel="nofollow">given here</a>. Is there any other simplest way rather than this example using angularjs or any other methods?</p>