Цикл по списку для добавления и удаления <span>с помощью jQuery

Question

Я звоню на сервер каждые 5 секунд, чтобы получить данные, затем перебираю мой список и добавляю «span» с нужными данными в мой список. Проблема в том, что я не могу сделать так, чтобы «span» исчезал, когда данные, возвращаемые с сервера, пусты, кроме случаев, когда я использую «fadeOut ()» в «span». Но тогда я не могу вычислить правильную сумму всех «li span» (countCont ()), так как они все еще добавляются в DOM и имеют значение. Поэтому я хотел бы удалить соответствующий «li span», если данные, возвращаемые с назначенного ему сервера, пусты, поэтому я могу вычислить правильную сумму. Вот как я назначаю данные в свой список:

     $.get(url, function (data) {
        $.each(data, function (i, info) {
          $("#accordion li").text(function (y, name) {
            if ($(this).is(":contains(" + info.cName + ")")) {
                if ($(this).is(":has(span)")) {
                    $(this).children().replaceWith('<span class = "cCount">' + info.count + '</span>');
                    $(this).children().fadeOut(10000);
                } else {
                    $(this).append('<span class = "cCount">' + info.count + '</span>');
                }
             }

             countCont($(this).parent().attr('id'));
          });
       });
    });

Answer 1

После того, как вы исчезли, удалите его из DOM, используя .remove ()

//...
$("#accordion li").text(function (y, name) {
   var $this = $(this); //also store this, dont select it 5 times

   if ($this.is(":contains(" + info.cName + ")")) {
      if ($this.is(":has(span)")) {
         $this.children().replaceWith('<span class = "cCount">' + info.count + '</span>');
         $this.children().fadeOut(10000);
         $this.remove();
      } else {
         $this.append('<span class = "cCount">' + info.count + '</span>');
      }
   }
   countCont($this.parent().attr('id'));
});

Редактировать: В ответ на комментарий это удалит промежуток, если он существует, затем добавит новый на:

//...

var $this = $(this); //also store this, dont select it 5 times

if ($this.is(":contains(" + info.cName + ")")) {
   if ($this.is(":has(span)")) {
      //remove the span
      var $span = $('span', this);
      $span.fadeOut(10000);
      $span.remove();
   }
   //always append new span
   $this.append('<span class = "cCount">' + info.count + '</span>');
}