¿Cómo agregar una clase justo al elemento superior del disparador con Jquery?
Pregunta
Estoy trabajando en un acordeón Jquery.Quiero agregar una clase al div que contiene la etiqueta <a> del disparador de acordeón.Puedes mirar mi código.Quiero agregar el nombre de la "primera" clase a la primera clase de "artículos de noticias" cuando hago clic en el título "Video de moda de recesión en Japón".
<!-- news items starts-->
<div class="newsitems">
<h3 class="business"> <a href="#" title="expand"><img src="images/expand_icon.gif" alt="collapse" class="collpase" /> Recession fashion in Japan Video</a> </h3>
<p class="timestamp">0100hrs</p>
</div>
<!-- news items ends-->
<!-- news items starts-->
<div class="newsitems">
<h3 class="sports"> <a href="#" title="expand"><img src="images/expand_icon.gif" alt="collapse" class="collpase" /> Murray survives five-set thriller at Wimbledon</a> </h3>
<p class="timestamp">0100hrs</p>
</div>
<!-- news items ends-->
Solución
Usted está buscando el href="http://api.jquery.com/closest/" rel="nofollow noreferrer"> closest
método , apartada encuentra el padre más interna que contiene un elemento.
Por ejemplo:
$('div.newsItems h3 a').click(function() {
$(this).closest('div.newsItems').addClass('first');
});
Otros consejos
$('div.newsitems h3 a').click(function() {
$(this).parent().parent().addClass('first');
});
También hay que añadir algo así como debajo de las líneas para eliminar la clase después de hacer clic otro factor desencadenante:
var dropDown = $(this).parent().next().next(); /* This is configured for my script. Yours may be different*/
$('div.newsitems').not(dropDown).removeClass('first');
Sólo para una respuesta alternativa.
$('div.newsItems').click(function(e){
if($(e.target).is("IMG")){
$(this).addClass("first");
}
}
Editar: Cambiado el if($(e.target).is("a")){
a IMG
Como SLaks señaló, me perdí esa etiqueta.