JSFiddle - React, Tailwind, and code Playground

HTML

<div id="a"></div>
<div id="b"></div>
<div id="c"></div>
<div id="d"></div>
<div id="e"></div>

<a id="go" href="#">Go!</a>

CSS

div { height: 20px; width: 20px; position: absolute; display: none; }

#a { background-color: red; }
#b { background-color: orange;}
#c { background-color: yellow;}
#d { background-color: green;}
#e { background-color: blue;}

JavaScript

$('div').each(function() {
    $(this).css({ // randomize start position
        'top': 20 + (Math.random() * 300),
        'left': 20 + (Math.random() * 300)
    }).show();
    var originalPosition = { // read position
        w: $(this).width(),
        h: $(this).height(),
        o: $(this).offset()
    };
    $(this).data('pos', originalPosition); // stash it
});

$('#go').click(function(e) {
    var unifiedPosition = {
        width: '100px',
        height: '80px',
        left: '100px',
        top: '200px'
    };
    $("#a,#b,#c,#d,#e").animate(unifiedPosition);
    var backToOriginal = function() {
        $('div').each(function() {
            var $d = $(this).data('pos');
            $(this).animate({
                'top': $d.o.top,
                'left': $d.o.left,
                'width': $d.w,
                'height': $d.h
            });
        });
    };
    setTimeout(backToOriginal, 2000);
    e.preventDefault();
});