Сопоставление классов с jquery

Question

У меня есть два неупорядоченных списка, немного похоже на:

<ul class="list1">
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
    <li class="current">Item 4</li>
    <li>Item 5</li>
</ul>

<ul class="list2">
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
    <li>Item 4</li>
    <li>Item 5</li>
</ul>

И цель с помощью jquery - определить, какой li помечен классом 'current', а затем добавить класс во второй список в соответствующий li. Я просто не могу придумать, как это сделать.

Спасибо.

Answer 1

$('ul.list2 li:nth-child(' + $('ul.list1 li.current').index() + ')').addClass('current');

Или вы можете сделать его чуть менее неприглядным:

$('ul.list2 li').eq($('ul.list1 li.current').index()).addClass('current');

Второй, мне нравится больше, теперь, когда я вижу их обоих :-) Здесь есть трюки:

1. фильтр "eq" позволяет вам выбрать элемент из списка jQuery на основе индекса;
2. функция index позволяет найти индекс элемента относительно его родных элементов в DOM

Answer 2

Просто используйте это:

var initialIndex = $('.list1 .current').index();
$('.list2 li').eq(initialIndex).addClass('current');

Answer 3

// Find the current item in the first list, remember its text
var textToMatch  = $('ul.list1 li.current').text();
// Loop through each li in the second list
$('ul.list2 li').each(function(index, domElement){
     var curr = $(domElement);
     // if the text matchs the first then add our class
     if(textToMatch == curr.text()){
          curr.addClass('NEWCLASS');
     }
 });

РЕДАКТИРОВАТЬ1: Это ответ на неправильный вопрос, с тех пор вопрос был уточнен, я оставлю это здесь, поскольку это все еще кажется хорошимчтобы достичь того же самого, опять же, не то, что вопрос после.

$('.list2 li:contains("' + // Find an li in list2 which contains
    $('.list1 li.current').text() + '")')  // the same text as the as the current li in list1
    .addClass("NEWCLASS"); // and add our new class to it

Answer 4

$('li.current + li').addClass('yourClass')

изменить: недоразумение вопроса

var index = $.inArray($('li.current')[0],$('li.current').parent().children());
$('ul:eq(1) li:eq('+index+')').addClass('selected');