Only the video that is clicked on should play

To reproduce issue: Click on one play button, and the video loads.

Then Click on the X

Now click on a different play button and you will see, the video that was clicked on before is now playing, along with the video I just clicked on. So now there are 2 videos playing at the same time.

To test code, press Run, not update: https://jsitor.com/l_crlisuws

What would need to be adjusted in the code to fix that?

How is that fixed in the code?

function createStopHandler(player) {    const stopButtons = document.querySelectorAll(".exit");    stopButtons.forEach(function stopButtonHandler(buttons) {      buttons.addEventListener("click", function buttonClickHandler() {        player.stopVideo();      });    });  }  function createPlayHandler(player) {    const playButtons = document.querySelectorAll(".thePlay");    playButtons.forEach(function playButtonHandler(buttons) {      buttons.addEventListener("click", function buttonClickHandler() {        player.playVideo();      });    });  }  function onPlayerReady(event) {    const player = event.target;    player.setVolume(100);    createStopHandler(player);    createPlayHandler(player);  }