用JQ在元素後面在加個元素，怎麼操作這個添加的元素？

Question

<button id="btn">按鍵</button>就是这个按键，我要点击之后，后面出现添加一个span，span做fadeOut(3000)的效果用  $("#btn").click(function() {
    $(this).after("<span></span>");
});这样在后面加了 span元素，然后怎么才能操作这个span呢？用$(this).next().html("3秒消失").fadeOut(3000)试了没有效果~大家帮帮忙

Answer 1

$("#btn").click( function() {
$("<span></span>").insertAfter($(this)).html('3秒消失').fadeOut(3000);
});

Answer 2

 1#正$("<span></span>").insertAfter($(this)).

Answer 3

3Q 搞定，就是這樣了
 
还有一个问题是，每次点击都会在后面追加个span，如果要每次点这个动画都重新开始要怎么弄最合适呢？$(":animated").remove();
$("<span></span>").insertAfter($(this)).html('3秒消失').fadeOut(3000);我自己 用这个试了试，貌似可行，大家帮忙指导下

Answer 4

这样连续点击按钮，span还是会连续产生。$btn.click(function() {
  $(":animated").remove();
  $("<span></span>").insertAfter($(this)).html('3秒消失').fadeOut(3000);
});
这样写，点击按钮就不会产生连续的span，但是如果页面中有其他动画，会一起remove掉，不是很合适，怎么弄能把“$(":animated").remove();”做成消除上一个span的形式？

Answer 5

给span加个id属性：
$("#btn").click( function() {
    $("#demo").remove();
$("<span id='demo'></span>").insertAfter($(this)).html('3秒消失').fadeOut(3000, function() { $(this).remove(); })
});