Unable to Reset Rock Paper Scissors Game

After clicking Play Again button to reset the game, the other buttons don’t work anymore. Any ideas why?

<!DOCTYPE html>
<html>
<head>
  <title>Rock Paper Scissors Game</title>
  <meta charset="UTF-8"/>
  <link href="Project-Rock Paper Scissors.css" type="text/css" rel="stylesheet">
</head>
<body>
<div class="buttons">
    <div class="rockButton">
       <button class="rock">
        <img src="https://cdn.instructables.com/F02/BBV9/I7Q0TFTU/F02BBV9I7Q0TFTU.LARGE.jpg?auto=webp&frame=1" 
        alt="rock" class="rockImage"> ROCK
       </button> 
    </div>
    <div class="paperButton">
        <button class="paper">
            <img src="https://graphics8.nytimes.com/images/2011/08/21/magazine/21mag-abstractimages-slide-2T4N/21mag-abstractimages-slide-2T4N-jumbo.jpg"
            alt="paper" class=paperImage> PAPER
        </button>
    </div>
    <div class="scissorsButton">
        <button class="scissors"> 
            <img src="https://graphics8.nytimes.com/images/2011/08/21/magazine/21mag-abstractimages-slide-IRQ1/21mag-abstractimages-slide-IRQ1-jumbo.jpg"
            alt="scissors" class="scissorsImage"> SCISSORS
        </button>
    </div>
</div>
<div class="reset">
    <button onclick="reset()"> Play Again </button> 
</div>
  <script>

    function computerPlay(){
        let random = ["rock", "paper", "scissors"];
        return random[Math.floor(Math.random()* random.length)];
    };

    const buttonRock = document.querySelector('.rock');
    const buttonPaper = document.querySelector('.paper');
    const buttonScissors = document.querySelector('.scissors');
    
    buttonRock.addEventListener('click', function (e){
        return "rock";
    });
    buttonPaper.addEventListener('click', function (e){
        return "paper";
    });
    buttonScissors.addEventListener('click', function (e){
        return "scissor";
    });
    
    let rounds = 0;
    let pp = 0;
    let cp = 0;

    const div = document.createElement('div');
    const selectDiv = document.querySelector('div');
    const para2 = document.createElement('p');
    const para = document.createElement('p');
    selectDiv.appendChild(para2);
    selectDiv.appendChild(para);
    
    function playRound (playerSelection, computerSelection){
        rounds+=1;
        para2.textContent = `Round ${rounds}: You chose ${playerSelection}. Computer chose ${computerSelection}`; 
        if(playerSelection == computerSelection){
            pp+=0; 
            cp+=0; 
            para.textContent = `Tied Round. Play again! You have ${pp} points. Computer has ${cp} points.`;  
        } else if (playerSelection == "rock") {
            if (computerSelection === "scissors"){
            pp+=1; 
            para.textContent = `You win. Rock beats scissors. You have ${pp} points. Computer has ${cp} points.`; 
            } 
            else {
            cp+=1;
            para.textContent = `You lose. Paper beats rock. You have ${pp} points. Computer has ${cp} points.`; 
            }
        } else if (playerSelection == "scissors") {
            if (computerSelection === "paper")
            {pp+=1; 
            para.textContent = `You win. Scissors beats paper. You have ${pp} points. Computer has ${cp} points.`; 
            } 
            else {
            cp+=1;
            para.textContent = `You lose. Rock beats scissors. You have ${pp} points. Computer has ${cp} points.`; 
            }
        } else if (playerSelection == "paper") {
            if (computerSelection === "rock")
            {pp+=1; 
            para.textContent = `You win. Paper beats rock. You have ${pp} points. Computer has ${cp} points.`; 
            } 
            else {
            cp+=1;
            para.textContent = `You lose. Scissors beats paper. You have ${pp} points. Computer has ${cp} points.`; 
            }
        } 
    }

    const button = document.querySelector('button');
    const buttons = document.querySelectorAll('button');
    
    buttons.forEach((button)=>{
        button.addEventListener('click', function buttonOnset(e){
            let computerSelection = computerPlay();
            let playerSelection = button.getAttribute('class');
            
            if (pp === 5){
                para2.remove(); 
                para.textContent = "You win! Play Again";
            }
            else if (cp === 5){
                para2.remove(); 
                para.textContent = "Computer wins! Play Again";
            }
            else {playRound(playerSelection,computerSelection)};
        
        })
    });

    function reset(){
        para2.remove();
        para.remove();
        cp=0;
        pp=0;
    }

</script>
</body>
</html>