jQuery滑动内容和导航活动状态

Question

我有这个jQuery代码，根据我点击的链接滑动内容，我也有链接的悬停效果，

$("#nav a").hover(function() {
    $(this).stop().animate({ paddingTop: "60px" }, 500);
}, function() {
    $(this).stop().animate({ paddingTop: "50px" }, 500);
});

var firstTime = true;
$("#nav a").click(function() {
    var divname = this.id;
    if (!firstTime) {
        if ($(".slid").hasClass(divname)) {
            firstTime = true;
            $(".slid").removeClass("slid").slideUp();
        } else {
            $(".slid").removeClass('slid').slideUp(500, function() {
                $("." + divname).slideToggle().addClass("slid");
            });
        }
    } else {
        $("." + divname).slideDown().addClass("slid");
        firstTime = false;
    }
});

这是HTML

<div id="nav">
    <ul>
        <li><a id="ett">ett</a></li>
        <li><a id="tva">två</a></li>
        <li><a id="tre">tre</a></li>
        <li><a id="fyra">fyra</a></li>
    </ul>
</div>  

所以我的问题是，当我点击链接时如何向链接添加活动状态，然后当我再次单击它们时它会消失。当我点击其他链接时，它会切换活动状态。

#nav li a.active {
    background-color: #242424;
    color: #FFFFFF;
    padding-top: 60px;
}

我还必须阻止活动链接上的动画，因此填充不会下降到50px但保持在60px。

非常感谢任何帮助！