javascript - 添加时应用淡入效果元素到

Question

<li>我想在将新元素添加到现有列表时应用淡入（或任何效果） 。示例：假设这是我现有的列表

<ul class='ul-1'>
<li class='cl'></li>
<li class='cl'></li>
<li class='cl'></li>
</ul>

现在我需要在它前面加上三个<li>元素：

<li class='cl'></li>
<li class='cl'></li>
<li class='cl'></li>

通过 ajax 获取，当这些新<li>元素被添加到列表中时，我需要应用淡入效果。此外，我必须确保所有新的三个元素同时淡入。

Answer 1

尝试

$('#add').click(function(){
    $('<li />', {
        class: 'cl',
        html: idx++
    }).hide().appendTo('.ul-1').fadeIn()
})

演示：小提琴