3

Necesito recoger todos los elementos que tienen la clase "events" en un array, para posteriormente recorrer el array en búsqueda de un atributo, ya sea por ejemplo, "blablabla". Si tiene "blablabla", le añadiré la clase "newClass".

He hecho la prueba con un script simple para seleccionar uno solo, y añadirle la clase. Pero me da error de "addClass is not a function".

Script:

$(document).ready(function(){
        console.log($(".day-schedule").find(".events")[1].addClass("newClass"));
});

Sin embargo, si le quito el selector del array "1", si me incluye la clase en todos los elementos.

HTML:

<ul>
    <li class="day-schedule"><div>Monday</div>
      <ul class="day">
        <li class="events" atributo"blablabla">
            <span>Hurduring</span>
        </li>
        <li class="events">
            <span>Hurduring</span>
        </li>
        <li class="events" atributo"blablabla">
            <span>Hurduring</span>
        </li>
        <li class="events">
            <span>Hurduring</span>
        </li>
      </ul>
    </li>

    <li class="day-schedule"><div>Wednesday</div>
      <ul class="day">
        <li class="events" atributo"blablabla">
            <span>Hurduring</span>
        </li>
        <li class="events">
            <span>Hurduring</span>
        </li>
        <li class="events" atributo"blablabla">
            <span>Hurduring</span>
        </li>
        <li class="events" atributo"blablabla">
            <span>Hurduring</span>
        </li>
      </ul>
    </li>
</ul>

Jfiddle del código: Jfiddle URL

2 respuestas 2

1

Cuando accedes al indice $(".day-schedule").find(".events")[1], esto retorna un elemento HTML no un objeto jquery, y como un element html no tiene el metodo addClass te lanza el error.

Utiliza la expresion :first para retornar solo el primer elemento encontrado en vez del acceso con indice:

console.log($(".day-schedule").find(".events:first").addClass("newClass"));

Pero si necesitas acceder por el indice al elemento html, puedes pasar el elemento que deseas a la funcion jquery para acceder al metodo addClass:

var elemento = $(".day-schedule").find(".events")[1];
console.log($(elemento).addClass("newClass"));
1
  • Efectivamente, creo que esto es lo que me hace falta. Ya que luego en el array jugaré con la posición, pasando el elemento por una condición que cumpla o no. En el caso de que cumpla, le añadiré la clase al elemento de la actual posición [i] y también a la anterior. De todas formas, intenté a encapsularlo en una variable pero me falló la sintaxis ya que estoy comenzando con JQuery y aun no me aclaro viniendo de JS. Gracias! Commented el 18 abr. 2018 a las 15:17
0

Para empezar tenés un error de sintaxis en el atributo, te falta el =.

Tuyo:

<li class="events" atributo"blablabla">

Correcto:

<li class="events" atributo="blablabla">

Luego, para lo que quieres hacer, es cuestión de agregarle al selector el atributo [atributo=blabla], quedando así:

$(".day-schedule").find(".events[atributo=blablabla]").addClass("newClass");

Te dejo el JSFiddle que subiste con el ejemplo funcionando.

1
  • Perdona @Kleith, eso es un atributo vacío que he añadido como ejemplo, en el código final no estará. Gracias igualmente por el aviso! Commented el 18 abr. 2018 a las 15:08

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.