Random Colors!

<button id="start-colors" style="font-size:150%">Random colors!</button>
<div id="colors" style="max-height:30em;overflow:scroll"></div>

var color_button = document.getElementById("start-colors");

function sleep(ms) {
    return new Promise(resolve => setTimeout(resolve, ms));
}

async function get_random_colors () {
    let run_colors = true;
    color_button.innerHTML="Pause";
    color_button.onclick = function () { run_colors = false };
    while (run_colors) {
        let color = "#" + Math.floor(Math.random() * 0xffffff).toString(16).padStart(6,'0');
        let colors = document.getElementById("colors");
        colors.innerHTML = '<div style="background-color:' + color + '">' + color + '</div>' + colors.innerHTML;
        await sleep(100);
    }
    color_button.innerHTML="Random Colors!";
    color_button.onclick = get_random_colors;
}

color_button.onclick = get_random_colors;