Не сортирует список ul li

Question

Бьюсь, бьюсь - не выходит. В чем ошибка, подскажите. Необходимо чтоб sup со значением +1 были первыми

$(document).ready(function() {
  $('.user_inf').each(function() {
    var target = $('.users_list ul'),
      count_msgs = $(this).find('sup').text();
    count_msgs = count_msgs || 0;
    var items = $(this);

    items.sort(function(a, b) {
      var num1 = parseInt($(a).count_msgs, 10),
        num2 = parseInt($(b).count_msgs, 10);
      if (num1 > num2) return 1;
      if (num1 < num2) return -1;
      return 0;
    });
    target.append(items);
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="users_list">
  <ul>
    <li class="user_inf">
      <span>John</span>
      <sup>+1</sup>
    </li>
    <li class="user_inf">
      <span>Hellen</span>
      <sup></sup>
    </li>
    <li class="user_inf">
      <span>Vasya</span>
      <sup>+1</sup>
    </li>
    <li class="user_inf">
      <span>Arnold</span>
      <sup></sup>
    </li>
  </ul>
</div>

Answer 1

function Comparator(a, b) {
  if (a[1] < b[1]) return 1;
  if (a[1] > b[1]) return -1;
  return 0;
}

const divs = $('div.users_list');
  
divs.each(function() {
  const lis = $(this).find('li.user_inf');
  const items = [];

  lis.each(function(index) {
    const sub_text = Number($(this).find('sup').text());

    items.push([this, sub_text]);
  });

  const sort_items = items.sort(Comparator);

  const clear_items = [];
  
  sort_items.forEach(item => clear_items.push(item[0]));

  $(this).find('ul').append(clear_items);
  
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="users_list">
  <ul>
    <li class="user_inf">
      <span>John</span>
      <sup>+1</sup>
    </li>
    <li class="user_inf">
      <span>Hellen</span>
      <sup></sup>
    </li>
    <li class="user_inf">
      <span>Vasya</span>
      <sup>+1</sup>
    </li>
    <li class="user_inf">
      <span>Arnold</span>
      <sup></sup>
    </li>
  </ul>
</div>

<div class="users_list">
  <ul>
    <li class="user_inf">
      <span>John</span>
      <sup>+3</sup>
    </li>
    <li class="user_inf">
      <span>Hellen</span>
      <sup>+2</sup>
    </li>
    <li class="user_inf">
      <span>Vasya</span>
      <sup>+1</sup>
    </li>
    <li class="user_inf">
      <span>Arnold</span>
      <sup></sup>
    </li>
  </ul>
</div>

Answer 2

$(document).ready(function() {
  var items = [];
  $('.user_inf').each(function() {
    var msgs = parseInt($(this).find('sup').text()) || 0;
    items.push({msgs: msgs, item: this});
  });

  var target = $('.users_list ul');
  items.sort((a, b) => b.msgs - a.msgs).forEach(i => target.append(i.item));
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="users_list">
  <ul>
    <li class="user_inf">
      <span>John</span>
      <sup>+1</sup>
    </li>
    <li class="user_inf">
      <span>Hellen</span>
      <sup></sup>
    </li>
    <li class="user_inf">
      <span>Vasya</span>
      <sup>+1</sup>
    </li>
    <li class="user_inf">
      <span>Arnold</span>
      <sup></sup>
    </li>
  </ul>
</div>

БЛОГ НА HUSL

Не сортирует список ul li

Ответы (2 шт):