Event listener targeting all elements on filtering method

I am having a little trouble building a mock shopping site. When a button is clicked it appends that item to a checkout menu. The button on the checkout menu is supposed to remove the selected element but instead it deletes the whole menu. I have ran a forEach, I have tried to append the remove button with the createElement method but it doesn’t work. I think the problem is that the buttons aren’t actually creating separate elements for itself and I don’t know how to fix it. Can someone point me in the right direction?

function addToCart(btns, cartItem) {

btns.forEach(btn => {
    btn.addEventListener('click', (e) => {

        if (shoppingList.indexOf(cartItem) !== -1) {
            return
        }
        else {
            cartMenuItems.innerHTML += `
            <div class=${'menu-items-container'}>
                <img width=150 height=125 src=${cartItem.image}>
                <div class=${'menu-titles-container'}>
                    <h2> ${cartItem.title}</h2>
                    <h3> ${cartItem.price}</h3>
                    <button class=${'menu-btn'}> Remove</button>
                </div>
            </div>
            `
            shoppingList.push(cartItem)
            cartItemCount.innerText = shoppingList.length;
        }

        const removeBtn = document.querySelectorAll('.menu-btn');
        removeItem(shoppingList, removeBtn)

        const getTotalOfItems = shoppingList.reduce((acc, current) => {
            return acc + current.price
        }, 0);


        menuTotal.innerText = getTotalOfItems
        return shoppingList
    });

});

}

function removeItem(shoppingItems, btns) {

    btns.forEach(btn => btn.addEventListener('click', (e) => {
        let newArr = shoppingItems.filter(item => item.id !== item.id)
        console.log(newArr)
        shoppingList = newArr
        cartMenuItems.innerHTML = newArr
        cartItemCount.innerText = newArr.length
        return newArr
    }))
}

135 thoughts on “Event listener targeting all elements on filtering method”

  1. hey there and thank you for your information – I’ve definitely picked up anything new from right here.
    I did however expertise several technical points using this web site, as I experienced to reload the web site a lot of times previous to I could get it to load correctly.
    I had been wondering if your web host is OK?
    Not that I’m complaining, but slow loading instances times will often affect your placement in google and can damage your high
    quality score if advertising and marketing with Adwords. Well
    I am adding this RSS to my e-mail and could look out for much more of
    your respective intriguing content. Ensure that you update this again very soon. http://antiibioticsland.com/Bactrim.htm

    Reply
  2. Pingback: cvs stromectol

Leave a Comment