Selecione o primeiro elemento de uma classe 'x' após um link com o jQuery

Question

Eu tenho algum código assim:

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

E eu gostaria de deixar os usuários clicarem no link e ser capaz de fazer algo com o período (faça -o piscar, esconda -o, o que for). Estou usando o jQuery, e é isso que tenho até agora:

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

Isso funciona desde que eu seja diligente em ter links antes dos vãos e nenhum outro código no texto. No entanto, não estou feliz com isso, e deve haver uma maneira melhor. Eu também tentei:

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

Mas isso seleciona todos os vãos da classe b, então não é bom.

Eu sou novo e perdido. Eu busco sabedoria.

Answer 1

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

deve funcionar bem para você. Ele recebe o irmão imediatamente seguinte.

Answer 2

Talvez você possa tentar isso?

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