jQuery中的append方法误区！

Question

先上测试代码,我想做这样一个效果，鼠标移入自动在div上添加删除字样，鼠标移出后消失

1. <div id="1">Item1</div>
2. <div id="2">Item2</div>
3. <div id="3">Item3</div> 

复制代码

1. <script type="text/javascript">
2. jQuery(function() {
3.         var ele = jQuery("div");
4.         ele.hover(function(){
5.                 jQuery(this).append("<span class='s'>删除</span>");
6.         },function(){
7.                 jQuery(this).remove(".s");
8.         });
9. });
10. </script>

复制代码转自 http://www.javaeye.com/topic/923943

这样的写法并不能达到效果，主要是jQuery(this).remove(".s");执行后没有效果，查看了光放的API，这样写到：

append(content)

这个操作与对指定的元素执行appendChild方法，将它们添加到文档中的情况类似。

参数content String, Element, jQuery

并没有太大收获，想了想可能是没有将新的代码加入dom中，于是把append中的参数由String换成jQuery对象，操作如下：

1.在HTML中添加<span class='s'>删除</span>

2.将jQuery(this).append("<span class='s'>删除</span>");改成jQuery(this).append(jQuery(".s"));

3.测试成功！