JSFiddle - React, Tailwind, and code Playground

HTML

<h2></h2>

<button>Test Click</button>

<canvas id="draw"></canvas>

JavaScript

$(document).ready(function () {
        /*
        NAME CHOOSER
    */
        var carl = ['durr', 'Shads', 'Cai', 'Moon', 'Sun', 'Staffy'];
        var rosie = ['Mum'];
        var prev;
        $('button').click(function () {
            prev = $('h2').text();
            $('h2').empty().text(carl[Math.floor(Math.random() * carl.length)] + rosie[Math.floor(Math.random() * rosie.length)]).after('<p>' + prev + '</p>');
        });
        
        var canvas = $("#draw")[0];
        if(canvas.getContext) {
         var ctx = canvas.getContext('2d');
         ctx.fillStyle = 'red';
         ctx.fillRect(0, 0, 800, 500);
        }
    });