Bloquer un résultat en cliquant sur la div

bonjour !!

je suis sur un nouveau projet assez banal qui est ce lui de créer un jeu sur le 4 2 1 !!

Je suis plutôt bien parti, mais je cherche un système qui puisse bloqué un résultat sans empêcher la fonction de continuer son rôle...
Ou alors il faudrait faire 3 fonctions est bloqué la fonction lié à une div (en cliquant sur la div par exemple)...

En résumé, si une personne fait 4 5 3 avec la fonction appelé au début, j'aimerais pouvoir bloqué le 4 et que la fonction puisse changer le 5 et le 3... Un système de "hold"

Voici mes codes
HTML

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<!DOCTYPE html>
<html>
	<head>
        <meta charset="utf-8" />
        <link rel="stylesheet" href="421.css" />
        <title>421</title>
    </head>
    <body>
        <h1>4 2 1</h1>
        <div id="bouton">
            <button id="lancer">Jouer !</button>
            <div id="resultat1"></div>
            <div id="resultat2"></div>
            <div id="resultat3"></div>
        </div>
    </body> 
    <script src="421.js"></script>
</html>

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
 
var lancer = document.getElementById('lancer');
lancer.addEventListener('click',roll);
var tab = [0,0,0];
 
function roll(){
    jet1 = Math.floor(Math.random()*6 +1);
    jet2 = Math.floor(Math.random()*6 +1);
    jet3 = Math.floor(Math.random()*6 +1);
    console.log(jet1);
    console.log(jet2);
    console.log(jet3);
    var dice1 = document.getElementById('resultat1');
    var dice2 = document.getElementById('resultat2');
    var dice3 = document.getElementById('resultat3');
    dice1.innerHTML = jet1;
    dice2.innerHTML = jet2;
    dice3.innerHTML = jet3;
    tab.splice(0,1,jet1);
    tab.splice(1,1,jet2);
    tab.splice(2,1,jet3);
    console.log(tab);
}

Merci