Javascript 一次制作一个段落的动画

我有一个div，里面有几段。我希望这些段落一个接一个地淡入淡出。我可以用下面的代码来实现。然而，由于我将有更多的div和许多其他段落，每个段落都有其唯一的类名，我想知道是否有更简单的方法来实现这一点，而不必一直复制粘贴代码，每次都更改类名

$（'.line1'）.css（'visibility'，'visibility'）.hide（）.fadeIn（1000，function（）{
$（'.line2'）.css（'visibility'，'visibility'）.hide（）.fadeIn（1000，function（）{
$（'.line3'）.css（'visibility'，'visibility'）.hide（）.fadeIn（1000，function（）{
$（'.line4'）.css（'visibility'，'visibility'）.hide（）.fadeIn（1000）；
});
});
});
.line1、.line2、.line3、.line4{
显示：无；
}

文本01

文本02

文本03

文本04

类名在这里并不重要，您可以使用
.line
或
或
.line{i}
或任何其他方法，只要有一种简单的方法可以选择所有类名

如果需要不同的类名，可以使用
.div1>p
代替代码中的
.line

如果轻微（+/-几毫秒）的不精确性不是问题，您可以使用setTimeout来解决这个问题


$（“.line”）。每个（函数（i）{
$（this.css（“不透明度”，0）；
设置超时（（）=>{
设置动画（{opacity:1}，1000）；
}，1000*i）；
});

文本01

文本02

文本03

文本04

您可以使用
delay
延迟后续的
fadeIn
s，如下所示：

for (var n = 1; n <= 4; ++n) {
    $(".line" + n).css('visibility','visible').hide().delay(1000 * (n - 1)).fadeIn(1000);
}


文本01

文本02

文本03

文本04

类名是否与上面一样，
行
后跟升序数字？或者这些类名可能是什么？@T.J.Crowder这些类将有不同的名称，但是，如果这有助于得到一个更实用的解决方案，我可以很容易地为它们附加一个升序数字。这几乎是完美的！谢谢你帮我。只有一个问题：出于某种原因，这些行的行为就像它们的显示为“无”，而不是“隐藏”的可见性。我的意思是，当一个div在页面上垂直居中时，每次新的文本淡入时，文本行都会移动。太好了！谢谢，伙计！