Как скрыть по одному li из списка снизу вверх?

Question

[S P]

Сейчас список появляется по одному снизу вверх, как скрыть их так же по одному снизу вверх?

$('.payment-innovation .list-block').each(function() {
          let items = $(this).find('ul li');
          items.css('opacity', 0);

          for (var i = 0; i < items.length; i++) {
            $(items[i]).delay(i * 400).animate({
              opacity: 1
            }, 400);
          }
        });	

let head__click = $('.payment-innovation .list-block .list-block__head') 
  head__click.click(function() {
    $(this).parent().find('.list-block__listing .item').fadeToggle()
  })

Answer 1

[0xD34F]

$('.payment-innovation .item').css('opacity', 0);

$('.payment-innovation .list-block__head').click(function() {
  const $this = $(this);
  const $items = $this.closest('.list-block').find('.item');
  const visible = $this.toggleClass('visible').hasClass('visible');
  const duration = 400;

  $items.each((i, n) => $(n)
    .delay((visible ? i : $items.length - i - 1) * duration)
    .animate({ opacity: +visible }, duration)
  );
}).click();

Comments

[S P]

Затупил)) спасибо большое)

[S P]

А как добавить к этому toggle и скрываются все блоки, а не 1?

[0xD34F]

Я не понимаю, что вы говорите.

[S P]

0xD34F, https://jsfiddle.net/9cyuxgq7/ Как скрывать по 1 списку)

[0xD34F]

Обновил ответ.

[S P]

0xD34F, благодарю и с Наступающими Праздниками)