如果單擊 div 但從其他元素中刪除相同的元素，如何添加元素？

Question

我有一個 onclick function 如果單擊 div 則添加一個元素

function clickOnADivToCreateLi(element) {
  var div = $(element);
  var i = document.createElement("i");
  $(i).addClass("fas fa-check-circle clicked");
  div.append(i);
}

但是當我單擊另一個具有相同 class 的 div 時，我有兩個具有相同<i>的 div，如果我再次單擊該 div 將有 2 個<i>

如何添加<i>但同時將其從其他人中刪除？

Answer 1

Select 與您分配給它的類匹配的i元素並在創建新實例之前調用remove() 。

另請注意，您的代碼可以更簡潔：

function clickOnADivToCreateLi(element) {
  $('i.fas.fa-check-circle.clicked').remove();
  $(element).append('<i class="fas fa-check-circle clicked" />');
}