Tell us what’s happening:
Your updateStats function should update the rollsElement element with the correct value.
Your code so far
<!-- file: index.html -->
/* file: styles.css */
/* file: script.js */
// User Editable Region
// Function to update the rolls and round on the page
const updateStats = () => {
roundElement.textContent = `Round: ${round}`; // Update the round display
rollsElement.textContent = `Rolls: ${rolls}`; // Update the rolls display with the correct value
};
// Roll dice logic with updateStats call
rollDiceBtn.addEventListener("click", () => {
if (rolls === 3) {
alert("You have made three rolls this round. Please select a score.");
} else {
rolls++;
rollDice();
updateStats(); // Call updateStats to update round and rolls on the page
}
});
// Rules button toggle logic
rulesBtn.addEventListener("click", () => {
isModalShowing = !isModalShowing;
if (isModalShowing) {
rulesBtn.textContent = "Hide rules";
rulesContainer.style.display = "block";
} else {
rulesBtn.textContent = "Show rules";
rulesContainer.style.display = "none";
}
});
// User Editable Region
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/131.0.0.0 Safari/537.36
Challenge Information:
Review Algorithmic Thinking by Building a Dice Game - Step 5