tengo una duda con jquery que no puedo resolver.
Tengo una lista (ul) con 5 elementos (li) lo que quiero es seleccionar sus hijos uno por uno y realizar lo siguiente.
- Agregarle o togglear una clase.
- Agregar un delay.
- Agregar / togglear otra clase (para que aparezca y desaparezca).
- Seleccionar el siguiente elemento para aplicarle los mismos efectos que al anterior.
- Hacer de esto un loop.
tengo entendido que con el selector child puedo hacerlo pero no entiendo bien como, serian de gran ayuda si me despejan esta duda.
esto es lo que tengo:
$("document").ready(function () {
$('.listado li').addClass('animated fadeinDown');
setTimeout(function () {
$(".listado li").addClass("fadeoutDown");
}, 1000);
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul class="listado">
<li id="sub1" class="">texto numero 1</li>
<li id="sub2" class="">texto numero 2</li>
<li id="sub3" class="">texto numero 3</li>
<li id="sub4" class="">texto numero 4</li>
<li id="sub5" class="">texto numero 5</li>
</ul>