Jquery의 하위 요소에 클래스 추가하기

Question

부모의 ID와 일치하는 스팬에 클래스를 할당하려하지만 작동하지 않습니다.

$("span.genre").click(function(e){ 
    var genre_id = $(this).attr('id'); 
    $('span.hidden '+genre_id).addClass('sub_genre'); 
}); 

및 원시 HTML :

<div id="genres"> 
    <span class='genre' id='1'>Rock</span> 
     <span class='hidden 1'>Alternative rock</span> 
     <span class='hidden 1'>Art rock</span> 
     <span class='hidden 1'>Christian rock</span> 
     <span class='hidden 1'>Experimental rock</span> 
    <span class='genre' id='5'>R&B/soul</span> 
     <span class='hidden 5'>Contemporary R&B</span> 
     <span class='hidden 5'>Disco</span> 
     <span class='hidden 5'>Soul</span> 
     <span class='hidden 5'>Pop R&B</span> 

Answer 1

당신은 스팬 elements.use 대상으로 잘못된 선택이 있습니다

$("span.genre").click(function(e){ 
    var genre_id = $(this).attr('id'); 
    $('span.hidden.'+genre_id).addClass('sub_genre'); 
}); 

Working Demo

Answer 2

내 실패 jQuery를은 다음과 같습니다

여기에 마지막 마침표가 없습니다. 01 23,:

$("span.genre").click(function(e){ 
    var genre_id = $(this).attr('id'); 
    $('span.hidden.'+genre_id).addClass('sub_genre'); 
}); 

jsFiddle example

당신이 스팬 숨겨진 클래스 요소 및 (존재하지 것) 1 또는 5의 하위 요소를 찾고 있었다 어떨까요.

Answer 3

약간의 실수입니다.

이

$('span.hidden.'+genre_id).addClass('sub_genre'); 

Answer 4

당신은 너무 이런 식으로 그렇게 할 수 있습니다 : 부모의 id` 일치

$("span.genre").click(function(e){ 
    $(this).nextUntil('.genre').addClass('sub_genre'); 
});