Не работает appendChild?

Question

[Flexx 97]

const cartWrapper = document.querySelectorAll('.cart__wrapper'),
    cart = document.querySelector('.cart'),
    close = document.querySelector('.cart__close'),
    open = document.querySelector('#cart'),
    goodsBtn = document.querySelectorAll('.goods__btn'),
    products = document.querySelectorAll('.goods__item'),
    confirm = document.querySelector('.confirm'),
    badge = document.querySelector('.nav__badge'),
    totalCost = document.querySelector('cart__total > span'),
    titles  = document.querySelectorAll('goods__title');

function openCart() {
    cart.style.display = 'block';
    document.body.style.overflow = 'hidden';
}

function closeCart() {
    cart.style.display = 'none';
    document.body.style.overflow = '';
}

open.addEventListener('click', openCart);
close.addEventListener('click', closeCart);

goodsBtn.forEach(function(btn, i){
    btn.addEventListener('click', () => {
        let item = products[i].cloneNode(true),
        trigger = item.querySelector('button'),
        removeBtn = document.createElement('div'),
        empty = document.querySelector('.empty');

        trigger.remove();

        removeBtn.classList.add('goods__item-remove');
        removeBtn.innerHTML = '&times';
        item.appendChild(removeBtn);

        cartWrapper.appendChild(item);

cartWrapper.appendChild(item) - В этой строке ошибка не могу понять почему

Answer 1

[Владимир Проскурин]

const cartWrapper = document.querySelectorAll('.cart__wrapper')

В cartWrapper будет содержаться список элементов, у которых есть класс cart__wrapper. Вероятно, вы хотели написать

const cartWrapper = document.querySelector('.cart__wrapper')

Так в cartWrapper будет только один элемент.