JSFiddle - React, Tailwind, and code Playground

HTML

<div class="phone-keys">1</div>
	<div class="phone-keys">2</div>
	<div class="phone-keys">3</div>

CSS

*{box-sizing: border-box;}
.phone-keys{width: 100px;height: 100px;float: left;background: gray; border: 1px solid yellow;margin-left: 50px;}

JavaScript

$(document).ready(function(){
	$('*').on('click', function(){
		$('.moved').animate({'left':'0'}, 2000, function(){
	    	$(this).removeClass('moved');
	    });
	});
	$(".phone-keys").not('.moved').on('click', function(){
	    $(this).css('position', 'relative').animate({'left':'-200px'}, 2000, function(){
	    	$(this).addClass('moved');
	    });
	});
});