Sélectionnez le premier élément d'une classe « x » après un lien avec jQuery

Question

J'ai un code comme ceci:

<p>Lorem ipsum<a href=# class="a">link</a><span class="b">Text</span>More lorem ipsum<a href=# class="a">link</a><span class="b">Text 2</span> 

Je voudrais permettre aux utilisateurs de cliquer sur le link et être en mesure de le faire quelque chose avec la durée (faites-le clignoter, cachez-le, peu importe). J'utilise jQuery, et voici ce que j'ai jusqu'à présent:

$('.a').click(function() { 
    $(this).nextUntil('.a').css('background-color', 'red'); 
}); 

Cela fonctionne aussi longtemps que je suis diligent d'avoir des liens avant les travées, et aucun autre code dans le texte. Cependant, je ne suis pas content, et il doit y avoir un meilleur moyen. J'ai aussi essayé:

$('.a').click(function() { 
    $(this).next('.b').css('background-color', 'red'); 
}); 

Mais qui sélectionne toutes les portées de la classe b, donc pas bon.

Je suis nouveau et à perte. Je cherche la sagesse.

Answer 1

$('a.a').click(function() { 
    $(this).next('span.b').css('background-color', 'red'); 
}); 

devrait fonctionner correctement pour vous. Il obtient le frère suivant immédiatement.

Answer 2

Peut-être que vous pourriez essayer cela?

$(".a").click(function() { 
    $(this).addClass("something_special"); 
    $(".something_special + .b").css({backgroundColor: "red"}); 
    $(this).removeClass("something_special"); 
});