Review DOM Manipulation by Building a Rock, Paper, Scissors Game - Step 5

JavaScript
1

Tell us what’s happening:

Hello

This is my code:

if (playerScore === 3 || computerScore === 3) {
if (playerScore > computerScore) {
winnerMsgElement.innerText = “Player has won the game!”;
resetGameBtn.innerText = el.style.display;
}
if (playerScore < computerScore) {
winnerMsgElement.innerText = “Computer has won the game!”;
resetGameBtn.innerText = el.style.display;
}

}

I am not sure where I am going wrong. Can someone please direct where I might be going wrong? Thanks

Your code so far

<!-- file: index.html -->


/* file: styles.css */


/* file: script.js */
// User Editable Region

const playerScoreSpanElement = document.getElementById("player-score");
const computerScoreSpanElement = document.getElementById("computer-score");
const roundResultsMsg = document.getElementById("results-msg");
const winnerMsgElement = document.getElementById("winner-msg");

const optionsContainer = document.querySelector(".options-container");
const resetGameBtn = document.getElementById("reset-game-btn");

function showResults(userOption) {
  roundResultsMsg.innerText = getRoundResults(userOption);
  computerScoreSpanElement.innerText = computerScore;
  playerScoreSpanElement.innerText = playerScore;

    if (playerScore === 3 || computerScore === 3) {
    if (playerScore > computerScore) {
      winnerMsgElement.innerText = "Player has won the game!";
      resetGameBtn.innerText = el.style.display;
    }
    if (playerScore < computerScore) {
      winnerMsgElement.innerText = "Computer has won the game!";
      resetGameBtn.innerText = el.style.display;
    }
  
}

};

// 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/127.0.0.0 Safari/537.36 Edg/127.0.0.0

Challenge Information:

Review DOM Manipulation by Building a Rock, Paper, Scissors Game - Step 5

2

You’re really close!

  1. The first IF statement looks good.
  2. If the first IF statement is true, then you know that either the computer has 3 points or the player has 3 points, it will be one or the other. So rather than two IF statements nested inside, you can nest a single IF...ELSE instead.
  3. In both cases where the computer or the player has 3 points, you'll be 'showing' the reset button and 'hiding' the options container, which means you'll be using the same code regardless of who won. So put that code below the nested IF...ELSE statement (but still inside the 'big' IF statement), then you only have to write it once.
  4. The last thing I can see is that you're trying to set the inner text of the reset button, but you actually aren't messing with the button text. The last thing you're changing is whether the reset button and the options container are hidden or not, and for that you'll use the 'style.display' property of those two elements (separately) to assign "block" for the one and "none" for the other.

I hope I said enough without saying too much. Good luck!

3

Thanks for the help. It worked.