.index() 클래스의 한 인스턴스에 대해서만

Question

나는 .index() 함수에 문제가있어. DOM의

내용 :

<div class="one"> 
    <div class="two"> 
     <div class="three"></div> 
     <div class="three"></div> 
     <div class="three"></div> 
    </div> 
    <div class="threeB"></div> 
    <div class="threeB"></div> 
    <div class="threeB"></div> 
</div> 

<div class="one"> 
    <div class="two"> 
     <div class="three"></div> 
     <div class="three"></div> 
    </div> 
    <div class="threeB"></div> 
    <div class="threeB"></div> 
</div> 

<div class="one"> 
    <div class="two"> 
     <div class="three"></div> 
     <div class="three"></div> 
     <div class="three"></div> 
    </div> 
    <div class="threeB"></div> 
    <div class="threeB"></div> 
    <div class="threeB"></div> 
</div> 

따라 어떤은 two에 three s의 사용자 클릭은 threeB들 중 하나가 표시된다. 나는 .index() 함수로 이것을하고 싶었지만 첫 번째 것을 제외하고는 모두 실패했습니다. 두 번째 one 클래스에서 두 개의 three은 (원하는 0과 1 대신에) 인덱스 3과 4를가집니다. 한편, threeB에 대한 .eq()은 원하는대로 작동하는 것처럼 보입니다.

문제가있는 div 전에 얼마나 많은 숫자를 넣지 않고도이 문제를 해결할 수있는 깔끔한 방법은 three입니까?

Answer 1

이 같은 노력하고 있습니다 :

$('.three').click(function(){ 
    $(this).parent().parent().find('.threeB').eq($(this).index()) 
     .css('background','green'); 
}); 

확인 여기 : jsFiddle