jQuery-改变下一个匹配元素的类

Question

这就是我所拥有的：

<li class="alternate"><i class="fa fa-fw fa-question"></i> Some text</li>
<li class="alternate"><i class="fa fa-fw fa-question"></i> Some other text</li>

我正在尝试制作它，以便在点击列表元素时，它的图标会将类从fa-question更改为fa-spinner fa-spin：

$('li.alternate').click(function() {
    $(this).next(".fa").attr('fa-question', 'fa-spinner fa-spin');
});

这不起作用。我可以触发警报或其他内容，因此点击功能正在运行，这只是我如何选择图标的问题。

建议？

Answer 1

您不希望next，i是您li的孩子，使用find - 同时定位class，而不是属性：< / p>

$(this).find(".fa").toggleClass('fa-question fa-spinner fa-spin');

Answer 2

试试这个：

$('li.alternate').click(function() {
  $(this).find(".fa").removeClass('fa-question');
  $(this).find(".fa").addClass('fa-spinner fa-spin');
});

PS：按照建议将next（）更改为find（）。

Answer 3

尝试这种方式：

$('li.alternate').click(function() {
  $('.fa', $(this)).removeClass('fa-question').addClass('fa-spinner fa-spin');
});

Answer 4

$(this).closest(".fa").attr('fa-question', 'fa-spinner fa-spin');