jQuery onclick添加/删除子元素的类

Question

这是HTML:

<a id="docLocked" title="Unlock this document" style="text-decoration: none; cursor: pointer;"><span class="iconfa-lock"></span></a>

单击"图标"时,我需要它删除span元素的类,然后添加另一个类.

这是我的,但它不起作用:

jQuery('#docLocked').click(function () {
        jQuery(this).closest('span').removeClass('iconfa-lock');
        jQuery(this).closest('span').addClass('iconfa-unlock');
    });

我在这做错了什么？

Answer 1

为什么不保持简单:

$('#docLocked').click(function(e){
    e.preventDefault();
    $(this).find('span').toggleClass('iconfa-lock iconfa-unlock');
});

JS小提琴演示.

参考文献:

• find().
• toggleClass().