JSFiddle - React, Tailwind, and code Playground

HTML

<html>
    <head>
    </head>
    
    <body>
        <div id="console">
            <h2>Console</h2>
        </div>
        <div id="content">
            <div class="cell">
                Cell1
            </div>
            <div class="cell">
                Cell2
            </div>
            <div class="cell">
                <div class="example">
                    Example1
                </div>
                <div class="example">
                    Example2
                </div>
                <div id="someid">
                    SomeID div
                </div>
                Cell3
            </div>
        </div>
    </body>
</html

CSS

div {
    border: 1px solid black;
    min-width: 30px;
    min-height: 30px;
    margin: 5px;
    float: left;
    padding: 20px;
}

#console {
    background: #DDF;
}

#console h2 {
    font-size: 1.5em;
}

JavaScript

$(function() {
    $("#content .cell").css({background:"cyan"});
    $("#content .example").css({border:"5px solid green"});
    $("#content").find("#someid").css({border:"5px solid blue"});
    log("Log message one");
    $("#content").css({border:"5px solid red"});
});

function log(msg) {
    $("#console").append("<pre>" + msg + "</pre>");
}