JQuery没有滑动效果（show，slideToggle ......）

Question

我是Jquery的新手，对于这个微不足道的问题感到遗憾，但我很困惑。这个JQuery代码应该做一些滑动效果（揭示HTML代码的一部分并隐藏三个点，特别有效）。问题是，它显示了<span class="toggle"></span>之间没有滑动效果的HTML代码（无论是show（）还是slideToggle（），没有或带有参数 - 慢，快......）。然而，当我第一次尝试它时，它很顺利，但经过一些刷新后它停止了动画。我找不到任何明显的问题。为什么会出现这种情况（独立于浏览器）？

HTML

<a href="#" class="toggle-button"> ...</a><span class=\"toggle\">blablabla1</span>
<a href="#" class="toggle-button"> ...</a><span class=\"toggle\">blablabla2</span>

JQUERY

<script type="text/javascript">
$('.toggle').hide();
$('.toggle-button').click(function(e){
    e.preventDefault();
    $(this).next().slideToggle();
    $(this).hide();
});
</script>

在我的HTML代码之后，JQuery被附加在BODY标记中。我正在使用这个JQuery库：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>

感谢。