JSFiddle - React, Tailwind, and code Playground

HTML

<div id='container'>
    <div class='synth' id='synth1'></div>
    <div class='synth' id='synth2'></div>
    <div class='synth' id='synth3'></div>
    <div class='synth' id='synth4'></div>
    
</div>

CSS

#container{
    width:200px;
    height:200px;
     background-color:grey;
}
.synth{ 
    width:50px;
    height:50px;
    border:solid;
    border-color:black;
    background-color:green;
position:relative;
}

JavaScript

$("#container").click(function(){
    

    
    
    $(".synth").css({
        'transition': 'all 1s',
        'transform': 'scale(0.5)',
         float:"right"

        
    });
})