I'm currently working on a shopping cart and trying to figure out why changing quantities is not working as expected. I've created two functions, one for adding quantities and the other for subtraction. My goal is to apply these functions to multiple items in the shopping cart. It seems to work when I change the p tag to an id instead of a class, but I want it to work for multiple items.
<div class="controlpic">
<img class="img" src="jsbook1.png">
<button onClick="onClick2()">-</button>
<p class="clicks">0</p>
<button onClick="onClick()">+</button>
<button class="addBasket">Add to Basket</button>
<div>some text about this product</div>
</div>
/* onclick function will add clicks for basket*/
var clicks1 = 0;
function onClick() {
clicks1 += 1;
document.getElementsByClassName("clicks").innerHTML = clicks1;
}
/* onclick function will take away clicks for basket*/
var clicks1 = 0;
function onClick2() {
if (clicks1 > 0) {
clicks1 -= 1;
document.getElementsByClassName("clicks").innerHTML = clicks1;
}
}