JSFiddle - React, Tailwind, and code Playground

by lollero

HTML

<div id="one">ONE</div>
<div id="two">TWO</div>

CSS

div {
    padding: 7px;
    margin: 5px;
    background: #f1f1f1;
    border: 1px solid #e1e1e1;
    float: left;
    clear: both;
    position: relative;
}

JavaScript

/* 

I have two or more elements that I want to animate with their own unique properties and values as well as properties and values that are identical in both animates without actually having to write the same thing twice.

*/


$('#one').animate({
    top: '20px',
    left: '20px'
}, 500 );

$('#two').animate({
    left: '20px'
}, 500 );