I'm coding a simple app to add itens to a shopping bag to study Javascript. However my js code didn't register when the element is clicked, it's not printing on console.
window.onload = function() {
//your code here
const fruitList = [{
'fruit': 'Banana',
'price': 3.9
},
{
'fruit': 'Orange',
'price': 0.7
},
]
const product = document.getElementById('products')
ListaFrutas.map((n) => {
product.insertAdjacentHTML('afterbegin', '<li class="fruits">' + n.fruit + '</li>');
})
const shoppingBag = []
const fruitproduct = document.querySelector('.fruits')
fruitproduct.addEventListener("onClick", handlerClick)
function handlerClick() {
console.log('it works')
}
}
<div id="content-produtos" class="flex" >
<ul id="produtos" >
</ul>
</div>
Assuming LitsaFrutas
is defined elsewhere, you should replace "onClick" with "click".
addEventListener("click", handlerClick);
See also: Difference between "click" and onclick