Project 1 Help with code

Hi all,

I’m working on my first project in my course progression and have chosen to make a rock, paper, scissors game in Javascript.

I can get the computer to randomly select an option, and I’ve managed to get the buttons on the page to link to the relevant options, but I can’t get the score to update. The array elements aren’t being updated by the code in the playRound function, but the display is correct (I can manually modify the array in the console and the page will update when I next press a button). Any ideas about what I’ missing?

The code is below:


  <title> Rock, Paper, Scissors </title>

    <script src=""></script>
    <link rel="stylesheet" href=>


      display: flex;
      flex-direction: column;
      align-items: center;
      align-content: center;

    #playerScore, #computerScore{
      display: inline-block;




    <h1 style="margin-top:100px;font-size:80px;"> Arena </h1>

    <div style="margin:20px;">
      <p style="font-size:40px;" id="playerScore"><strong> Player </strong> 0 </p>
      <p style="font-size:40px;" id="computerScore"> 0 <strong> Computer </strong> </p>

    <div style="font-size:30px;">
      <button style= "background-color: white;" id="rockButton"> Rock </button>
      <button style= "background-color: white;" id="paperButton"> Paper </button>
      <button style= "background-color: white;" id="scissorsButton"> Scissors </button>

    <div style='font-size:40px;' class='score'>

    <div style='font-size:40px; margin-top:20px;' class='message'>


    <div style="font-size:20px; margin-top:20px;" class="victor">



const choices = ['Rock','Paper','Scissors'];
const buttons = document.querySelectorAll('button');
const message = document.querySelector('.message');
const score = document.querySelector('.score');
const scores = [0,0];

for (let i = 0 ; i < buttons.length ; i++){
    buttons[i].addEventListener('click', playGame);

function playGame(e){
  let playerChoice =;
  let computerChoice = choices[Math.floor(Math.random()*choices.length)];

  //on button click, computer should select random number
  //random number is converted to rock/paper/scissors via array index

  //function playRound tested successfully in console (with manually entered choices)
  //scoring doesn't work properly

  function playRound(playerChoice, computerChoice) {
    if (playerChoice === computerChoice){
      document.getElementById("victor").innerHTML = "It's a tie!";
    else if (playerChoice === 'Rock'){
      if (computerChoice === 'Paper'){
        document.getElementById("victor").innerHTML = 'you lose! Paper beats Rock!';
        scores[1] += 1;
      else {
        document.getElementById("victor").innerHTML = 'you win! Rock beats Scissors!';
        scores[0] += 1;
    else if (playerChoice === 'Paper'){
      if (computerChoice === 'Scissors'){
        document.getElementById("victor").innerHTML = 'you lose! Scissors beats Paper!';
        scores[1] += 1;
        document.getElementById("victor").innerHTML = 'you win! Paper beats Rock!';
        scores[0] += 1;
    else {
      if (computerChoice === 'Rock'){
        document.getElementById("victor").innerHTML = 'you lose! Rock beats Scissors!';
        scores[1] += 1;
        document.getElementById("victor").innerHTML = 'you win! Scissors beats Paper!';
        scores[0] += 1;
  document.getElementById("playerScore").innerHTML = '<strong> Player </strong>' + scores[0] ;
  document.getElementById("computerScore").innerHTML = scores[1] + '<strong> Computer</strong>';
  //output player and computer's selections
  messenger('<strong>' + playerChoice + '</strong> VS <strong>' + computerChoice + '</strong><br>');

  function messenger(selectionMessage){
  message.innerHTML = selectionMessage;



</html> ```

Thanks in advance,


Hey @Ciaran, hope you are great.

You have a nested function (playRound inside playGame) this could lead into issues with you variables playerChoice and computerChoice , I suggest to separate them, playRound should be outsite and invoce it inside playGame maybe. Also too many IF and Else could be not the best case, have you think to use a swtich instead?

If you have any more questions, please let us know so we can help you! :slight_smile:

Carlos Z.

1 Like