JSFiddle - React, Tailwind, and code Playground

by thecodeparadox

HTML

<div id='hi1'/> aaa </div>

CSS

body {
    background-color: whitesmoke;
}

.header{
    font-size: 20px;
    padding-bottom: 20px;
    cursor:pointer;
}

/* thanks to raingroove for the main styling ! */
.main-content {
    margin: 0 0 12px 70px;
    padding: 0;
    background: rgb(251, 251, 251);
    width: 80%;
    -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
    -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.35);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
    position:relative;
    margin-left: 20px;
    margin-top: 20px;
    background-color: white;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 22px;
    height: 20px;
    overflow: hidden;
}

.expand {
    height: 200px;
}

JavaScript

$.fn.sayHi = function() {
    alert($(this).text());
    return this;
}

$('#hi1').sayHi();