在两个字体真棒图标之间切换

Question

我正在尝试在两个字体很棒的图标之间切换fa-angle-right和fa-angle-down。

HTML代码段

＆＃13;

＆＃13;

let tagItem = document.getElementById('tag-item');
let angleCount = 0;
const angle = document.getElementById('angle-img');

tagItem.addEventListener('click',function(){

    if (angleCount %2 === 0) {
      angle.classList.remove('fa-angle-right');
      angle.classList.add('fa-angle-down');
    } else {
      angle.classList.remove('fa-angle-down');
      angle.classList.add('fa-angle-right');
    }
    
    angleCount++;
    console.log(angle.classList);
    
});

＆＃13;

<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

<li id="tag-item" class="list-item">
<i class="fa fa-tag"></i><span id="tags">Tags</span><i id="angle-img" class="fa fa-angle-right"></i>
</li>

＆＃13;

＆＃13;

＆＃13;

我尝试使用ID＆＃39; angle-img＆＃39;

尝试为TAG i切换它

控制台记录该类正在切换的证据：

DOMTokenList(2) ["fa", "fa-angle-down", value: "fa fa-angle-down"]0: 
"fa"1: "fa-angle-down"length: 2value: "fa fa-angle-down"__proto__: 
DOMTokenList
DOMTokenList(2) ["fa", "fa-angle-right", value: "fa fa-angle-
right"]
base.html:303 DOMTokenList(2) ["fa", "fa-angle-down", value: "fa fa-
angle-down"]

正在根据需要切换课程，但图标不会切换。 如何在这两个图像之间切换？