jquery使用.click重置.animate

Question

我的.removeAttr函数有问题。 我想要做的是在单击时调整div的大小，并在页面的任何一点再次单击时将其重置为正常大小。

HTML：

<div id="test1" class="test">some text</div>
<div id="test2" class="test">more text</div>

CSS：

.test{
float:left;
height:50px;
width:50px;
border-radius:25px;
font-size:18px;
}
#test1{
background-color:#f1f1f1;
margin-top:20px;
}
#test2{
background-color:#E1CCF0;
margin-top:60px;
}

JQUERY：

当我点击页面上的任何地方时，我应该以某种方式重置

$(document).ready(function(){
$(".test").click(function() {
$(this).animate({
width: "200px",
height: "200px",
fontSize: "1.5em"},1000);
});
});

我也尝试过：

$(document).ready(function(){
$(".test").click(function() {
$(this).animate({
width: "200px",
height: "200px",
fontSize: "1.5em"
},1000);
});
$(.test).click(function(){ 
$(this).removeAttr('style');
});
});

但那根本不起作用...... 我希望你能帮助我:)。