adding css class to the selected tab in next and previous tab jquery tab
<p>I want to add css class to the currently selected tab content so when i click on the next button the css of the currently selected tab content should be changed.</p>

<p>I have tried the following code but it is not working:</p>

<pre><code> $("#tab-div").tabs();

    $(".next-tab").click(function () {

        var selected = $("#tab-div").tabs("option","selected");
        $("#tab-div").tabs("option", "selected", selected + 1);
        $(this).parent().removeClass("current");
        $(this).find("a").addClass("current");
        $(this).addClass("current");
     });

    $(".prev-tab").click(function () {
        var selected = $("#tab-div").tabs("option", "selected");
        $("#tab-div").tabs("option", "selected", selected - 1);
        $(this).parent().removeClass("current");
        $(this).find("a").addClass("current");
        $(this).addClass("current");

    });
</code></pre>

<p>HTML</p>

<pre><code>&lt;div class="prev-tab"&gt;
&lt;a href="#" title="Previous"&gt;&amp;nbsp;&lt;/a&gt;
&lt;/div&gt;
&lt;div class="next-tab"&gt;
&lt;a href="#" title="next"&gt;&amp;nbsp;&lt;/a&gt;
&lt;/div&gt;    




 &lt;div id="tab-div"&gt;
&lt;ul class="nav"&gt;
&lt;li&gt;&lt;a href="#tab1" class="current"&gt;New Group&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="#tab2"&gt;For Companies&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;div id="tab1" class="current"&gt;
&lt;/div&gt;
 &lt;div id="tab2"&gt;
&lt;/div&gt;     
</code></pre>

<p>Thanks,</p>
