使用append（）后JQuery无法正常工作

I have a button that has the .append() function. So every time I click on that button, it adds 1 new DIV element to the body.

我有一个具有.append()函数的按钮。因此,每次单击该按钮,它都会向主体添加1个新的DIV元素。

But the DIV elements have the fadeIn() function. That means every time I add a new DIV element, it should fade in slowly, but it doesn't.

但是DIV元素具有fadeIn()函数。这意味着每次我添加一个新的DIV元素时,它应该缓慢淡入,但事实并非如此。

<button id="btn1">CLICK</button>
<div class="box"></div>

HERE IS THE DEMO

这是演示

I have found some similar problems here but none of them really helped me so I would be very glad if someone gave me a decent solution.

我在这里发现了一些类似的问题,但没有一个真正帮助过我,所以如果有人给我一个体面的解决方案,我会很高兴。

1 个解决方案

#1

you can try something like this

你可以尝试这样的事情

$('#btn1').on('click',function(){
    $("body").append(
        $(document.createElement('div'))
            .addClass('box')
            .fadeIn(3000)
    );
});

Fiddle demo here

小提琴演示在这里

#1