JSFiddle - React, Tailwind, and code Playground

HTML

<audio src="https://www.freesound.org/data/previews/165/165575_934775-lq.mp3" id="beep"></audio>
<div class="shell">
    <div class="attempts"></div>
</div>

CSS

body {
    background: #333;
}
.shell {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    overflow: none;
}
.attempts {
    position: absolute;
    bottom: 0;
    padding-left: 50px;
    color: #CCC;
    font-family: monospace;
    font-size:20px;
    line-height: 23px;
}
.attempts p {
    margin: 0;
    padding: 0;
}
}

JavaScript

var utils = (function () {

    var chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!@%_";

    function getRandomChar() {
        return chars.charAt(getRandomInt(0, chars.length - 1));
    };

    function getRandomInt(min, max) {
        return Math.floor(Math.random() * (max - min + 1)) + min;
    };

    var getRandomString = function () {
        var len = getRandomInt(8, 15);
        var str = "";

        while (len-- > 0) {
            str += getRandomChar();
        }

        return str;
    };

    return {
        getRandomString: getRandomString,
        getRandomInt: getRandomInt
    };
})();

var passwords = (function (utils) {
    var passwords = [];
    var hashes = [];

    var real = '';

    var hash = function (s) {
        // really naive encryption
        s = s + s + s + s + s;
        s = s + s + s + s + s;
        s = s + s + s + s + s;
        s = s + s + s + s + s;
        s = s + s + s + s + s;
        return s;
    };

    var init = function (num) {
        for (i = 0; i < num; i++) {
            var pass = utils.getRandomString();
            passwords.push(pass);
            hashes.push(hash(pass));
        }

        real = hashes[utils.getRandomInt(0, hashes.length)];
    }

    var isPassword = function (pass) {
        var hashed = hash(pass);
        var success = true;
        var count = 50000;

        while (count-- > 0) {
            success = real === hashed;
        }

        return success;
    }

    var getRandomPassword = function () {
        return passwords[utils.getRandomInt(0, passwords.length - 1)];
    }

    return {
        init: init,
        isPassword: isPassword,
        list: passwords,
        getRandomPassword: getRandomPassword
    }
})(utils);

passwords.init(30);

$(function () {
    var attempts = $('.attempts');
    var beep = $('#beep')[0];

    var message = function (msg) {
        beep.play();
        $('<p>' + msg + '</p>').appendTo(attempts);
       ...