Используйте Jquery для захвата пар Even / ODD, Even / ODD, Even / ODD

Question

Я пытаюсь получить Четные, Нечетные пары из нескольких <p> тегов на основе имени класса тегов <p>.Пример кода, который я пытаюсь заставить работать:

CSS

body p{
 display: none;
}

HTML : (мое решение не может имеют атрибуты id, и все они должны иметь одинаковое имя класса)

<p class="storyline">Random sentence one</p>
<p class="storyline">Random sentence two</p>
<p class="storyline">Random sentence three</p>
<p class="storyline">Random sentence four</p>
<p class="storyline">Random sentence five</p>
<p class="storyline">Random sentence six</p>
<p class="storyline">Random sentence seven</p>

JQUERY

$( document ).ready(function() {

 // getting several <p> tags with the same class name
 $(".storyline").each(function(index) {

   //Need to grab,  even/odd  even/odd  even/odd,  to be faded in until either, none left, or fade in last individual item
   $(this).delay(1000*index).fadeIn('slow').delay(3000);
});
});

В настоящее время я могу загрузить только каждоеТег <p> индивидуально.Я пытаюсь загрузить такие пары, как индексные точки, [0][1] [2][3] [4][5] ... и т. Д., Пока не останется ничего или элемент , который необходимо загрузить по отдельности .

Если кто-то может помочь с этим, это будет оценено.

Answer 1

Нашел что-то, что сработало здесь .. https://stackoverflow.com/a/2358665/10896569

Изменен код для удовлетворения моих потребностей:

$(document).ready(function(){
  var p; 
  p=true; 
  $('p.storyline:even').each(function(index){
    var t=$(this);
    var paired = t.add( $('p.storyline:eq('+(t.index()+1)+')', t.parent()) );
  //call function
    if (p){p=true;paired.delay(3000*index).fadeIn('slow').delay(2000).fadeOut('slow').addClass('greenc');}
    else  {p=false; paired.delay(3000*index).fadeIn('slow').delay(2000).fadeOut('slow').addClass('redc');}
  });
});