Анимация js

[Мария Киришина]

Ребят, помогите разобраться. По клику

[NO PARSE]<div class="phone-keys">1</div>[/NO PARSE]
сдвигается влево и по клику возвращается в исходное положение. Возвращаясь в исходное положение div, прежде, чем остановиться, делает несколько движений вправо-влево. Как сделать так, чтобы при возврате в исходное положение div останавливался сразу же, без лишних движений?

Код css:

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

Код js:

$(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');
	    });
	});
});

________
Код нужно оформлять по правилам:
тегом [CODE]..[/СODE]
(это кнопочка на панели форматирования с решёточкой #)
Не забывайте об этом!

Модератор.

[obivan88]

Приветствую,
в указанной Вами части кода нет ничего, что могло бы вызвать такое поведение элемента, вот предоставленный код собранный воедино:
https://codepen.io/obivan/pen/qXpygO

Возможно причина в другом месте кода?