Condición de paginación javascript

Mi problema es que cuando selecciono la página 2 quiero ocultar los elementos 0-4 y mostrar los elementos 5-8, pero cuando hago clic en 0-4 no se oculta. Creo que es porque mi condición “if” está mal. ¿Puede alguien ayudarme con la condición “if”? ¿O hay otra manera de hacerlo? ¿Y puedo limitar la cantidad de datos mostrados cuando se cargue por primera vez?

let data = Array.from(Array(15).keys()).map(item => ({ topic: `Header ${item}`, detail: `Detail ${item}`}))

let tourlek = document.querySelector('#tourlek')
let pagination = document.querySelector('#pagination')
let itemPage = document.getElementsByTagName('item-page')

let item = data.length
let page = 1
let limit = 4
let limitFn = Math.ceil(item / limit)

for (let i = 0; i < item; i++) {
  let div = document.createElement('div')
  div.textContent = `${data[i].topic} - ${data[i].detail}`
  div.classList = 'pd'
  tourlek.appendChild(div)
}

for (let i = page; i <= limitFn; i++){
  let a = document.createElement('a')
  a.textContent = `P:${page}`

  // addEventListener onPage function when click
  a.addEventListener('click', onPage)

  a.setAttribute('data-page', page)
  page = page + 1

  pagination.appendChild(a).href = 'javascript:void(0)'
}

function onPage (event) {
  let itemDom = document.querySelectorAll('.pd')
  let currentPage = event.target.getAttribute('data-page')

  for (let i = 0; i < itemDom.length; i++) {
    if (i >= limit * currentPage ) {
      itemDom[i].style.display = 'none';
    }  else {
      itemDom[i].style.display = '';
    }
  }
  console.log(event.target.getAttribute('data-page'))
}

a {
  margin: 0 10px;
}

<div>
  <div id="tourlek"></div>
  <div id="pagination"></div>
</div>