JSFiddle - React, Tailwind, and code Playground

HTML

<div id="mainBlock"></div>

CSS

#mainBlock{
	width: 50px;
    height: 50px;
    background: grey;
    position: relative;
	transition: 0.5s;
}

JavaScript

squareMove();

function squareMove(){
	var mainBlock = document.getElementById('mainBlock'), curPos=0;
    mainBlock.addEventListener ('click', function(){
        curPos=Number(mainBlock.style.top.slice(0, -2))+100;
        mainBlock.style.marginTop=curPos+'px';
    });
}