SO Help: Uncaught syntax error using jQuery's animate

http://stackoverflow.com/questions/18669791/uncaught-syntax-error-using-jquerys-animate

by SpYk3

HTML

<button id="but1">animate 1</button>
<button id="but2">animate 2</button>
<button id="but3">RESET</button>
<div class="red"> RED 1 </div>
<div class="red"> RED 2 </div>
<div class="red"> RED 3 </div>
<div id="blue"> BLUE </div>
<div id="grey"> GREY </div>

CSS

.red { background: #F00; border: 1px solid; color: #FFA; }
#blue { background: #00F; border: 1px solid; color: #0F0; }
#grey { background: #666; border: 1px solid; color: #036; }

JavaScript

$(document).ready(function() {
	$('#but1').click(animateOne);
	$('#but2').click(animateTwo);
    
    //    see more about .finish 
    //    http://api.jquery.com/finish/
	$('#but3').button().on('click', function(e) { $('div').finish().removeAttr('style') });
});

function animateOne() {    //    here you'll see all 3 ways of calling css variable
    $('#but3').click();
	$('.red').finish().animate({'margin-left':"200"},{duration:2000});
	$('#blue').finish().animate({"margin-top":"30"},{duration:1000});
	$('#grey').finish().animate({marginBottom:"200"},{duration:1500});
}

function animateTwo() {
    $('#but3').click();
	//	jQuery Chaining means you don't need to
	//	recall this element to add another event
	$('.red').finish().animate({'margin-left':"400"},{duration:2000})
		.animate({'opacity':"0.2"},{duration:3000});
	
	$('#blue').finish().animate({'margin-top':"30"},{duration:1000});
	
	//	also, you had error here with 1500px,
	//	if you intend to use px as a size value,
	//	it too will need to be enclosed in Quotes
	$('#grey').finish().animate({'margin-bottom':"200"},{duration:1500});
}