jQuery 상위 div에만 클래스가있는 요소를 토글합니다

Question

저는 이틀 동안 내 책상에서 머리를 때려 왔습니다. db : 제목, 링크, 미리보기 이미지 및 정렬되지 않은 목록에 래핑 된 시간 정보를 표시하는 앱을 만들고 있습니다. http://blog.madebycraig.com/images/full.jpg
내가하려는 것은 요소에 최소화 버튼이있는 것입니다. 축소판 그림과 시간을 켜고 끄기로 전환 할 수 있습니다. http://blog.madebycraig.com/images/minimized.jpg
이 작업을 수행 할 수 있지만 전부 또는 전부입니다. 하나의 최소화 버튼을 클릭하면 모든 것이 사라집니다. 최소화 단추가있는 div의 자식 인 특정 클래스 이름을 가진 항목을 토글하려면 어떻게합니까? 나는 .parent(), .child(), .next(), .prev()를 시도했다. 내가 아는 모든 것을 던져 버렸어. 이제 나는 너에게 친절한 선생님 (또는 마담)을 돌린다. 내가 도대체 ​​뭘 잘못하고있는 겁니까? 여기에 그것을 실행하려고하는 ul이 있습니다. 당신이 많이 가지고, 또는이 아약스를 통해 변경하는 경우 (검색 - resulty 것처럼 보인다)

$(".collapse").click(function() { 
    $(this).closest('.bookmarkContainer').find('.toggle').toggle(); 
}); 

, .live()를 사용

echo' 
<li class="bookmarkContainer"> 
<a href="'.$row['url'].'" class="toggle"><img class="thumb" src="images/placeholder.png" /></a> 
<div class="title"><a href="'.$row['url'].'" class="bookmrk" target="_blank">'.$row['title'].'</a></div> 
<div class="dt toggle">'.relativeTime($row['dt']).'</div><br /> 
<a class="collapse" href="#">hide</a> 
<a class="delete" href="?delete='.$row['id'].'" id="'.$row['id'].'">Delete Bookmark</a> 
</li>'; 

Answer 1

이 같은 .closest() 및 .find()를 사용하여 작업을 수행 할 수 있습니다 또는 .delegate()은 다음과 같습니다.

$(".collapse").live('click', function() { 
    $(this).closest('.bookmarkContainer').find('.toggle').toggle(); 
}); 
//or... 
$("#ulID").delegate('.collapse', 'click', function() { 
    $(this).closest('.bookmarkContainer').find('.toggle').toggle(); 
});