在更改项目宽度时动态地向链接添加类

Question

我目前在li中有一个链接，当我单击链接以使<li>的宽度变大时，下面的Jquery工作，然后当它更大回到原始状态时关闭它。

我的问题是如何修改下面的Jquery，在<a>打开时添加其他类，并在关闭时将其删除

<li>，宽145px：<a href="" class="followtextheader open">Follow us</a>

<li> at 50px：<a href="" class="followtextheader">Follow us</a>

<li class="followUs special">
  <a href="" class="followtextheader">Follow us</a>
</li>


$(document).ready( function(){
    $('.followtextheader').click( function() {
        event.preventDefault()
        var toggleWidth = $(".followUs").width() == 50 ? "145px" : "50px";
        $('.followUs').animate({ width: toggleWidth });
    });
});

提前致谢

Answer 1

只需将此行添加到函数 -

即可

$(this).toggleClass('open');

$('.followtextheader').click( function(event) {
        event.preventDefault();
        $(this).toggleClass('open');
        var toggleWidth = $(".followUs").width() == 50 ? "145px" : "50px";
        $('.followUs').animate({ width: toggleWidth });
    });