javascript - 切换div的第一个元素的类

这可能对我来说很简单，但我坚持在这里！

代码：

<a href="#" class="icon">
    <i class="fa fa-arrow-down"></i>
    <h6>Heading</h6>
</a>

点击时，我想将fa-arrow-down类更改为fa-arrow-up。我尝试了很多可能性，但没有找到解决方案。请帮助大家...

我尝试的方法之一是...

$('.icon').click(function () {
    if ($(this).children(':first').hasClass('fa-arrow-down')) {
        $(this).children(':first').removeClass('fa-arrow-down').addClass('fa-arrow-up')
    }
})

console.log($(this).children())输出：

[i.fa.fa-angle-down, h6, prevObject: n.fn.init[1], context: a.icon]
0:i.fa.fa-angle-down
1:h6

谢谢

最佳答案

您可以使用toggleClass()方法轻松完成此操作，如下所示。

$('.icon').click(function () {
    $(this).children(':first').toggleClass('fa-arrow-up fa-arrow-down')
})

关于javascript - 切换div的第一个元素的类，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/38532501/