Dado el siguiente html:
<div class="container"> <form class="form" id="login"> <h1 class="form__title">Login</h1> <div class="form__message form__message-error"></div> </form> </div>¿Hay una manera fácil de hacer referencia al elemento de la clase "form__message"? Sé que este es el único elemento de esta clase en este ejemplo, pero potencialmente podría haber más. Así que estaba intentando lo siguiente para eliminar las propiedades CSS de form__message-error:
$("#login .form__message").classList.add("form__message--error");Esto, sin embargo, no encuentra el elemento correcto, mientras que lo siguiente funciona:
document.querySelector("#login").querySelector(".form__message").classList.remove("form__message--error");Estoy buscando una alternativa jQuery a la última declaración.
Estás mezclando métodos jQuery y DOM. El equivalente jQuery de .classList.add() es .addClass() .
$("#login .form__message").addClass("form__message--error"); No necesita .find() con querySelector() , puede usar el mismo selector que con jQuery:
document.querySelector("#login .form__message").classList.add("form__message--error");