JSFiddle - React, Tailwind, and code Playground

by podlipensky

HTML

<div id="foo">
    <span class="bar">Text</span>
    <div class="foo"></div>
    <div class="foo"></div>
    <div class="foo"></div>
    <div class="foo"></div>
    <div class="foo"></div>
</div>

CSS

div {
width: 100px;
height: 100px;
border: solid 1px green;
background: lime;
}
span {
color: red;
}
#foo {
position: relative:
        right: 100px;
    border: solid 1px red;
}

JavaScript

$(document).ready(function(){
    $('.bar').on('click', function(){
       $('.bar').css({
            color: 'blue',
            display: 'block',
            background: 'yellow'
        });
    });
    
    $('.foo').bind('click', function(){
        $(this).animate({
            position: 'absolute',
            right: 0
        }, 1000, 'swing');
    });
});