Как по клику показывать следующие N элементов?

Question

[Анна]

Нужна помощь, ребят.
Тут код https://jsfiddle.net/5z2vyfgv/1/
Нужно по клику показывать следующие 2 элемента и т.д., пока не покажем все элементы.

Answer 1

[Alex Ander]

https://jsfiddle.net/5z2vyfgv/5/

const ITEMS_COUNT_PER_CLICK = 2;

const showButton = document.querySelector('a');
const items = document.querySelectorAll('li');
const itemsCount = items.length;
let i = ITEMS_COUNT_PER_CLICK;

for (; i < itemsCount; ++i) {
	items[i].style.display = 'none';
}

i = ITEMS_COUNT_PER_CLICK;

const callback = (event) => {
	if (i >= itemsCount) {
  	alert('nothing to show!');
    //showButton.removeEventListener('click', callback);
    //showButton.outerHTML = '';
    return;
  }
  
  items[i++].style.display = '';
  if (i < itemsCount) {
  	items[i++].style.display = '';
  }
};

showButton.addEventListener('click', callback);

<ul>
<li>123456789</li>
<li>123456789</li>
<li>123456789</li>
<li>123456789</li>
<li>123456789</li>
<li>123456789</li>
<li>123456789</li>
<li>123456789</li>
<li>123456789</li>
<li>123456789</li>
<li>123456789</li>
<li>123456789</li>
<li>123456789</li>
  
</ul>

<a>Показать</a>