JQuery - Как добавить класс к каждому последнему элементу списка?

Есть код, который не работает:

$("#sidebar ul li:last").each(function(){
      $(this).addClass("last");
});

В основном у меня есть 3 списка и вы хотите добавить класс (последний) к каждому элементу, последнему в каждом неупорядоченном списке.

<ul>
      <li>Item 1</li>
      <li>Item 2</li>
      <li class="last">Item 3</li>
</ul>

Надеюсь, что это имеет смысл, Ура!

ОТВЕТЫ

Ответ 1

Легкая ошибка. Попробуйте следующее:

$("#sidebar ul li:last-child").addClass("last");

В принципе: последнее не совсем так, как вы думаете. Он соответствует только последнему в документе, а не последнему в каждом списке. Для этого: для последнего ребенка.

Ответ 2

с jquery добавьте это

$("ul li").last().addClass('last');

Ответ 3

Причина, по которой это не будет работать, объясняется тем, что :last соответствует только одному элементу. Из документации jQuery:

Соответствует последнему выбранному элементу.

Так что ваш код делает, это получить набор всех элементов <li> в <ul>, а затем из этого набора, берущего последнее значение. Пример:

 <ul>
   <li>1</li>
   <li>2</li>
 </ul>
 <ul>
   <li>3</li>
   <li>4</li>
 </ul>
 <ul>
   <li>5</li>
   <li>6</li>
 </ul>

Ваш код вернет элемент <li>6</li>. (Внутри он собирал <li>1</li> до <li>6</li>, а затем удалял последний и возвращал его).

То, что вы ищете, это то, что другие ответы здесь сказали: :last-child.

Ответ 4

Или вы можете указать свой список id и использовать его в качестве контекста для jquery-call.

<ul id="myList">
  <li>Item</li>
  <li>Item</li>
  <li>Item</li>
  <li>Item</li>
</ul>

<ul id="anotherList">
  <li>Item</li>
  <li>Item</li>
  <li>Item</li>
  <li>Item</li>
</ul>

И тогда вы можете сделать:

jQuery("li:last", "ul#myList").addClass("lastItem");

Теперь последний li в первом списке будет иметь класс "lastItem".

Изменить: Извините, неправильно прочитал вопрос. Игнорируйте это, пожалуйста.

Ответ 5

Если вам нужно добавить класс в 3 отдельных списка, вы можете назначить для них класс и использовать "каждый":

$('#sidebar ul.class li:last-child').each(function(e){
    $(this).addClass("last");
});

Это должно работать точно так, как вы ожидали.

Ответ 6

вы можете попробовать

$('#sidebar ul li:last').addClass('last');