jQueryのclickイベントを記述したのですが、１回目のクリックが効きません。

相対位置の座標を変化させることでdivを上下にスライドさせるのが目的です。
初めのクリックでは何も起こりません。
2回目以降は思い通りにスライドします。

どのような対処をとればよいのかわかりません。。。
以下がコード内容です。
///////////////////////////////////////////////////////////////////////
/* javascript　*/
$(function(){
$("#button").click(function(){
$(this).toggleClass("clicked");
if($(this).hasClass("clicked")){
$("#contents").animate({"top":"-380px"},"normal");
}else{
$("#contents").animate({"top":"0"},"normal");
}
});
});
///////////////////////////////////////////////////////////////////////////
宜しくお願い致します。