Rock Paper Scissors Proj - Event listener anonymous functions won't execute

Having finished the ‘console version’ of the Rock Paper Scissors game, I decided to try and style it out a bit. The issue I’m having is with the event listeners which are(should) be assigned to their respective buttons.

After scouring google for answers, I’ve seen numerous cases of people putting their script tag in the head of their html doc, which renders the buttons after the script gets run resulting in no functionality. I’ve made sure to place my script tag at the end of my html body, which should negate this issue. In addition, DevTools shows that there is indeed an Event Listener attached to each button, but it appears that the anonymous function wont execute upon being clicked.

Having checked my DOM variables that are using ‘getElementById’ and proper use of eventListeners, I just can’t quite figure out what I’m doing wrong.

I realize there is some code that is currently unused which will eventually be completed, but I don’t believe it to be affecting anything negatively at the moment. I am hoping to get the functionality of these buttons put to rest before continuing on to these elements.

Any assistance would be greatly appreciated!

Body of html:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="./main.css" />
    <title>Rock Paper Scissors</title>
  </head>
  <body>
    <h1>Rock Paper Scissors</h1>
    <h3>Click your draw</h3>
    <button id="rock"><i class="far fa-hand-rock"></i></button>
    <button id="paper"><i class="far fa-hand-paper"></i></button>
    <button id="scissors"><i class="far fa-hand-scissors"></i></button>
  <h4>Draw Result</h4>
  <ul>
    <li>computer</li>
    <li>player</li>
  </ul>
<script src="./script.js"></script>
</body>

Javascript:

//DOM declarations
const rockBtn = document.getElementById('rock');
const paperBtn = document.getElementById('paper');
const scissorsBtn = document.getElementById('scissors');
const draws = ['rock', 'paper', 'scissors'];

//internal variables
let playerSelection = '';
let computerSelection = '';
let playerScore = 0;
let computerScore = 0;


//computer draw
function computerDraw() {
  let draw = draws[Math.floor(Math.random() * draws.length)];
  computerSelection = draw;
}


//comparing draws
function playRound(playerSelection, computerSelection) {
  if (playerSelection === 'rock' && computerSelection === 'paper') {
    computerScore += 1;
    return 'Paper beats rock. You lose! :(';
  } else if (playerSelection === 'rock' && computerSelection === 'scissors') {
    playerScore += 1;
    return 'Rock beats scissors. You win! :)';
  } else if (playerSelection === 'paper' && computerSelection === 'scissors') {
    computerScore += 1;
    return 'Scissors beats paper. You lose! :(';
  } else if (playerSelection === 'paper' && computerSelection === 'rock') {
    playerScore += 1;
    return 'Rock beats paper. You win! :)';
  } else if (playerSelection === 'scissors' && computerSelection === 'rock') {
    computerScore += 1;
    return 'Rock beats scissors. You lose! :(';
  } else if (playerSelection === 'scissors' && computerSelection === 'paper') {
    playerScore += 1;
    return 'Scissors beats paper. You win! :)';
  } else {
    return 'Draw... Throw again.';
  }
}

//end game
//if (playerScore === 5) {
  console.log('You Win!');
}
//if (computerScore === 5) {
  console.log('Computer Wins');
}

//Player draw event listeners
rockBtn.addEventListener('click', () => {
  playerSelection = 'rock';
  computerDraw();
  playRound(playerSelection, computerSelection);
});
paperBtn.addEventListener('click', () => {
  playerSelection = 'paper';
  computerDraw();
  playRound(playerSelection, computerSelection);
});
scissorsBtn.addEventListener('click', () => {
  playerSelection = 'scissors';
  computerDraw();
  playRound(playerSelection, computerSelection);
});

The eventListeners are firing. But playRound() returns a string.

You aren’t doing anything with that string.