Sujet : JQUERRY

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Examen juin 2019</title>
        <meta name="author" content="Complétez ici par votre nom">
        <style>
            body { font-family:Consolas; color:#eee; font-size: 48px; background-color: #91b;}
            .numero {width: 100px; height: 100px; background-color: #bbf; display: inline-block; margin: 10px; cursor: pointer; }
            .bouton {width: 100px; height:100px; background-color:#719;}
            .bouton:hover {background-color: #308;}
            .bouton:active {background-color: #ccc;}
            .couleur {background-color: #888;}
        </style>
    </head>
    <body>
        <section>
            <h1>Examen juin</h1>
            <div class="bouton" id="moins">-</div>
            <div class="bouton" id="plus">+</div>
        </section>
        <section id="nums">
        </section>
        <script src="jquery-3.3.1.min.js"></script>
        <script>
            $(document).ready(function() {
                var nb= Math.floor(2+Math.random()*7); //de 2 à 8
                for (let i=1 ; i<=nb ; i++) {
                    $("#nums").append('<div class="numero" id="n'+i+'">'+i+'</div>');
                }

                $('#moins').click(function(){
                console.log('test');
                    if(nb>1) {
                        $('#n'+nb).remove();
                        nb--;
                    }
                    if (nb==1) {
                        $('.numero').addClass('couleur');
                    }
                    else {
                        $('.numero').removeClass('couleur');
                    }
                });
                $('#plus').click(function(){
                    if(nb<9) {
                        nb++;
                        $("#nums").append('<div class="numero" id="n'+nb+'">'+nb+'</div>');
                    }
                    if (nb==9) {
                        $('.numero').addClass('couleur');
                    }
                    else {
                        $('.numero').removeClass('couleur');
                    }
                });
            });
        </script>
    </body>
</html>