JSFiddle - React, Tailwind, and code Playground

HTML

<div id="widget1" class="widget">
    <div class="widget-title">My Account</div>
    <div class="widget-content">
        <div class="chart">
            Chart Currently Unavailable
        </div>
        <div class="chart-period">
            <input type="radio" name="chartperiod" value="7" /> 7 days
            <input type="radio" name="chartperiod" value="14" /> 14 days
            <input type="radio" name="chartperiod" value="30" /> 30 days
        </div>
    </div>
</div>

<div id="widget2" class="widget">
    <div class="widget-title">WatchList</div>
    <div class="widget-content">
        <input type="text" value="Enter a symbol" />
        <input type="button" value="Add Symbol" />
        <div class="watch-items">
            <h1>You have no watch items!</h1>
        </div>     
    </div>
</div>

CSS

.widget
{
    width: 350px;
    height: 150px;
    background-color: #c0c0c0;
    margin-bottom: 20px;
}

.widget-title
{
    text-align: center;
    width: 100%;
    height: 25px;
    background-color: #989898;
}

.widget-content
{
    padding: 5px;
}

.chart-period
{
    margin-top: 10px;
}

.chart
{
    background-color: #C8C8C8;
    width: 200px;
    height: 80px;
}

.watch-items
{
    margin-top: 10px;
    padding: 20px;
    height: 50px;
    background-color: #c8c8c8;
}

JavaScript

$(document).ready(function() {
    $('').css('border', 'solid 2px red');
});