Tell us what’s happening:
My resetGameBtn event works correctly when I test it, but it’s still not passing the test. Could someone help me figure out what’s wrong? Thanks in advance!
STEP 13 (Test Desc)
If the player or computer has won the game, there should be an option to reset the game and play again.
Add an event listener to the resetGameBtn button. Your event listener should take in a "click" event and a reference to the resetGame function.
Your code so far
<!-- file: index.html -->
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Rock, Paper, Scissors game</title>
<link rel="stylesheet" href="./styles.css" />
</head>
<body>
<h1>Let's play Rock, Paper, Scissors!</h1>
<main>
<details class="rules-container">
<summary>Rules to the game</summary>
<p>You will be playing against the computer.</p>
<p>You can choose between Rock, Paper, and Scissors.</p>
<p>The first one to three points wins.</p>
<p>Here are the rules to getting a point in the game:</p>
<ul>
<li>Rock beats Scissors</li>
<li>Scissors beats Paper</li>
<li>Paper beats Rock</li>
</ul>
<p>
If the player and computer choose the same option (e.g., Paper and
Paper), then no one gets the point.
</p>
</details>
<div class="score-container">
<strong
>Player Score: <span class="score" id="player-score">0</span></strong
>
<strong
>Computer Score:
<span class="score" id="computer-score">0</span></strong
>
</div>
<section class="options-container">
<h2>Choose an option:</h2>
<div class="btn-container">
<button id="rock-btn" class="btn">Rock</button>
<button id="paper-btn" class="btn">Paper</button>
<button id="scissors-btn" class="btn">Scissors</button>
</div>
</section>
<div class="results-container">
<p id="results-msg"></p>
<p id="winner-msg"></p>
<button class="btn" id="reset-game-btn">Play again?</button>
</div>
</main>
<script src="./script.js"></script>
</body>
</html>
/* file: styles.css */
/* file: script.js */
// User Editable Region
function resetGame() {
playerScore = 0
computerScore = 0
playerScoreSpanElement.textContent = playerScore
computerScoreSpanElement.textContent = computerScore
resetGameBtn.style.display = "none";
optionsContainer.style.display = "block";
winnerMsgElement.innerText = "";
roundResultsMsg.innerText = "";
}
resetGameBtn.addEventListener("click", resetGame);
// 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/147.0.0.0 Safari/537.36
Challenge Information:
Build a Rock, Paper, Scissors Game - Step 13