change picture of dice when click on roll dice

section3/app.js

@@ -7,18 +7,29 @@ GAME RULES:
 - The first player to reach 100 points on GLOBAL score wins the game
 */
 
-var scores, dice, roundScore, activePlayer;
+var scores, roundScore, activePlayer;
 
 scores = [0, 0];
 roundScore = 0;
 activePlayer = 0;
-dice = Math.floor(Math.random() * 6) + 1;
 
-document.querySelector("#current-" + activePlayer).textContent = dice;
+// document.querySelector("#current-" + activePlayer).textContent = dice;
 // document.querySelector("#current-" + activePlayer).innerHTML = "<h1>" + dice + "</h1>";
 
 //-----------------------------------------------------------------
 // var x = document.querySelector("#score-1").textContent;
 // console.log(x);
 
-document.querySelector(".dice" ).style.display = "none";
+document.querySelector(".dice").style.display = "none";
+
+document.querySelector(".btn-roll").addEventListener("click", function() {
+  //create random number
+  var dice = Math.floor(Math.random() * 6) + 1;
+  // disply the result
+  var diceDOM = document.querySelector(".dice");
+  diceDOM.style.display = "block";
+  diceDOM.src = "./dice-" + dice +".png";
+  // update current scores, if the rolled number was not one
+  if (dice !== 1) {
+  }
+});