JSFiddle - React, Tailwind, and code Playground

by Rafael Boschini

HTML

<div class="icon-cracha"></div>  

<button id="cadastre-se" name="submit" class="btn">Próximo</button>

CSS

.icon-cracha{
  width:100px;
  height: 100px;
  background-color:black;
  border-radius: 100%;
  position:absolute;
  top:-100px;
}

button{
  margin-top: 100px;
}

JavaScript

$(document).ready(function(){

	$('#cadastre-se').click(function(){
      $('.icon-cracha').css('top','-100px');
  	  $('.icon-cracha').stop(true, true).delay(500).animate({top: "+0"},1000);
  });
  
});