Нужно использовать
Node.appendChild
или
Node.insertBefore
,
document.write
в твоем случае затирает весь html на странице, этот метод не используют на практике.
Ты можешь в цикле создать новый DOM элемент с помощью
document.createElement
, поместить в него нужный тебе html с помощью
Element.innerHTML
и каждую итерацию вставлять этот элемент в нужный элемент (в нашем случае
#cart_content
) с помощью
Node.appendChild
или
Node.insertBefore
.
По поводу ошибки в консоли - Она появлялась из-за неверного условия в цикле, вместо
i <= numbersOfProduct
, должно быть
i < numbersOfProduct
, так как чтобы пройти по всему массиву нужно 4 итерации, с 0 до 3, а не 5, как было у тебя - с 0 до 4, и когда выполнялась последняя (пятая) итерация, такого элемента в массиве уже не было и выбрасывалась эта ошибка.
jsfiddle