How to load 4 objects?

Question

JavaScript

I have an array of 24 objects, but only the first 8 are displayed, the rest should be loaded in 4 pieces when the (View more) button is pressed, how to implement this correctly?

let kitchenList = document.querySelector('.type-wardrobe');
let buttonMore = document.getElementById("btnMore");
let maxItems = 8;

function outputKitchens() {
    for (let i = 0; i < maxItems; i++) {
            let kitchenItem = document.createElement('li');
            kitchenItem.classList.add('type');
            kitchenList.append(kitchenItem);
    }
}

Answer 1

I threw a variant on a quick hand. It's not perfect... it's not clear what you're doing)