I'm trying to create a dice roller game which adds all of the dice throws into a sum total. I want to be able to have multiple dice rollers open at the same time.
My problem is that ALL the dice are being added together, instead of each separate roller counting its own dice.
You'll see what I mean in this fiddle here: https://jsfiddle.net/txdq7upw/9/
I think the problem is in this code here, since it's taking every element called "dice":
function getSumDiceValue() {
var dice = document.getElementsByClassName("dice");
var diceTotal = 0;
for (var i = 0; i < dice.length; i++) {
diceTotal += Number(dice[i].getAttribute("data-diceValue"));
};
return diceTotal;
};
My guess is that I need to somehow associate the dice to their own dice roller, but I don't know how to go about doing that.
I'm very new to JavaScript, if it's not too much to ask I'd love some code examples if possible.