将<li>元素添加到<ul> </ul> </li>时应用淡入效果

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()
})

演示：Fiddle