다음 비 하위 요소를 얻는 방법

Question

게시하기 전에 정직하게 검색을 시도했지만 특정 내용을 찾을 수 없습니다. 내 과제는 사용자가 링크를 클릭 할 때 숨겨진 콘텐츠를 블로그에 표시하는 것입니다. HTML은 다음과 같습니다 : 이제

<div class="entry"> 
<p>Here is a visible content <a class="a-toggle"> Read More...</a></p> 
<div class="hidden_post"><p>Here is all the hidden content</p></div> 
</div> 

jQuery를 내가 뭘 다음 그러나 작동하지 않습니다 :

$(".hidden_post").hide(); 
$(".a-toggle).click(function() { 
$(this).next(".hidden_post").slideDown("slow"); }); 

---

그래서 다음 요소를 얻기 위해 내가 먼저 부모 요소에 갈 필요 거기서부터 검색을 진행하십시오. 이제 실제로는 하나의 "항목"에 여러 개의 숨겨진 내용이 포함될 것이므로 더 복잡해집니다. 이처럼 :

<div class="entry"> 
<p>Here is a visible content <a class="a-toggle"> Read More...</a></p> 
<div class="hidden_post"><p>Here is hidden content #1</p></div> 
<p>Here is a visible content <a class="a-toggle"> Read More...</a></p> 
<div class="hidden_post"><p>Here is hidden content #2</p></div> 
<p>Here is a visible content <a class="a-toggle"> Read More...</a></p> 
<div class="hidden_post"><p>Here is hidden content #3</p></div> 
</div> 

는 지금은 $(this).parent().next(".hidden_post").slideDown("slow"); 그것은에 "항목"사업부를 이동합니다 사용하는 경우와 만 먼저 "hidden_post"를 찾을 수 있습니다. 내 생각 엔 옆에있는 <a class="a-toggle">에서 <div class="hidden_post">까지 곧바로 갈 다른 해결책이 필요합니다. 어떤 해결책이 있습니까?

Answer 1

당신은 parent() 사용할 수 있습니다

$(".hidden_post").hide(); 
$(".a-toggle").click(function() { 
    $(this).parent().next(".hidden_post").slideDown("slow"); 
}); 

Answer 2

이 경우 가장 빠른 방법은 부모 할 것 -> 다음

$(".a-toggle").click(function(){ 
$(this).parent().next(".hidden_post").slideDown("slow"); 
}); 

Answer 3

당신은 모든 직계 자식을 얻기 위해 아이들이 방법을 사용할 수를 부모 요소.

$('div.entry').children('div.hidden_post'); 

div의 모든 div 자식을 hidden_post 클래스의 항목 클래스로 반환합니다.