JSFiddle - React, Tailwind, and code Playground

HTML

<h3>Число от 0 до 8 сгенерировано и хранится в памяти</h3>

<div class="num">...</div>
<button id="b1">Показать это число</button>
<div id="win">...</div>
<div id="btns" />
<div id="rate" />

CSS

.bt {
display:inline-block;
min-width: 50px;
width: 50px;
margin: 3px;
}

body {
font-family: "Helvetica", "Arial", "FreeSans", "Verdana", "Tahoma", "Lucida Sans", "Lucida Sans Unicode", "Luxi Sans", sans-serif;
background: #f6f6f6;
overflow: hidden;
padding: 0;
margin: 0;
position: relative;
font-size: 14px;
}

JavaScript

size = 3;
succ = 0;
fail = 0;

function makeNext() {
    var prev = next;
    next = Math.floor(Math.random() * (size*size));
    return prev;
}
next = 0;
makeNext();
$(".num").hide();
function showNum() {
    $(".num").html(makeNext().toString());
    $(".num").slideDown(300).delay(800).slideUp(300);
}
$("#b1").click(showNum);

for (var i = 0; i < size*size; i++) {
    if (i % size == 0) $("#btns").append('<br/>');
    $("#btns").append('<button class="bt" id="bt' + i + '">' + i + '</button>');
    $("#bt" + i).click(function () {
        if ($(this).html() == next) {
            $("#win").html('Win!');
            showNum();
            succ++;
        }
        else {
            $("#win").html('No.');
            fail++;
        }
        var rate = succ / (succ + fail + 0.001);
        rate *= 100;
        rate = Math.floor(rate);
        $("#rate").html('Частота угадывания:'+rate+'%');
        $("#rate").append('<br/>'+succ + '/' + fail);
    });
}