JQuery: ¿Cómo agregar una clase a cada último elemento de la lista?

Question

Tengo un código aquí que no funciona:

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

Básicamente tengo 3 listas y quiero agregar una clase (última) a cada elemento que aparece en último lugar en cada lista desordenada.

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

¡Espero que tenga sentido, saludos!

Answer 1

error fácil de hacer. Prueba esto:

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

Básicamente: última no acaba de hacer lo que piensa que lo hace. Es sólo coincide con el último en el documento, no el último en cada lista. Eso es lo que:. Último hijo es para

Answer 2

con jquery agrega esto

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

Answer 3

La razón por la que no funciona es debido al hecho de que :last sólo coincide con uno de los elementos. A partir de la documentación de jQuery:

  

Partidos del último elemento seleccionado.

Así que lo que su código está haciendo es conseguir un conjunto de todos los elementos en un <li> <ul> y después de la establecida tomando el último valor. Ejemplo:

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

Su código devolvería el <li>6</li> elemento. (Internamente, sería recoger <li>1</li> a <li>6</li> y luego cortar el último y devolverlo).

Lo que estamos buscando es lo que las otras respuestas aquí han dicho:. :last-child

Answer 4

O usted podría dar a su lista un id y usar eso como un contexto para jquery-llamada.

<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>

Y entonces usted puede hacer:

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

Ahora el último li en la primera lista tendría clase "lastItem".

Edit: Lo siento, leído mal la pregunta. No haga caso de esto, por favor.

Answer 5

Si es necesario agregar a la clase 3 listas separadas puede asignar una clase para ellos y utilizar 'cada uno':

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

Esto debería funcionar exactamente como se esperaba.

Answer 6

puede probar

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