Javascript 如何分别设置每个div的动画

我试图展示产品，当我应用动画时，它将应用于整个

div

比如说

<div class="product_area">
    <div class="product">1</div>
    <div class="product">2</div>
    <div class="product">3</div>
    <div class="product">4</div>
    <div class="product">5</div>
</div>

$(document).ready(function()
{
    $(".product_area").slideUp(); //Whole div slides up.
    $(".product").slideUp(); //Just one product slides up.
}

1.
2.
3.
4.
5.
$（文档）.ready（函数（）
{
$（“.product_area”）.slideUp（）；//整个div向上滑动。
$（“.product”）.slideUp（）；//只有一个产品向上滑动。
}

我想要的是，产品从右边一个接一个地滑入。

查看这个

$（函数（）{
//$（“.product_area”）.slideUp（）；//整个div向上滑动。
//$（“.product”）.slideUp（）；//只有一个产品向上滑动。
无功延迟=500
$（'.product'）。每个（函数（）{
$（this.delay（delay）.toggle（“幻灯片”）；
延迟=延迟+1500；
});
})；

/*将您的css放在这里*/
.产品{
显示：无；
宽度：100px；
背景色：#ccc；
填充：15px；
边缘底部：20px；
}

1.
2.
3.
4.
5.

你能添加一个plunker吗？我刚刚用

$（'.product'）测试了你的代码。slideUp（）

所有产品同时向上滑动。@Wayne plunker是一个在线编辑工具，你可以运行你的代码片段吗