Updating HTML element based on items in array

I am trying to make a shopping cart system for an assignment. As of now, when you click “add to cart” it will take the object from the products array and move it to the cart array, and also display the name of the most recently added item. It also will update the count but not the list when you click remove from cart. However, I am trying to make it so that it displays all names within the cart array, not the one most recently added to the cart. Also, when you click remove from cart, it removes the item based on the button you selected.

On click, push one item from an an array to another, and change text dependent on items in array

I am trying to set it so that if I click on a button with the class of “addtocart” it will check the id of the button in the HTML document and iterate through the products array objects until it finds the object with the same Id as the button on the element, and then push it to the cart array. I then need to change the innertext of the “cartamnt” span so that based on how many items are added to the cart, text “0 cart” becomes “1 cart”, etc..