jQuery的控制單的DIV相同類別（兄弟姐妹？）

Question

我建立了我的網站FAQ模塊，我希望能控制，即使他們都具有相同的類頁面上的單一元素。我相信這是屬於我還不熟悉的兄弟姐妹。

基本上，我希望用戶能夠點擊的問題DIV，然後當他們點擊它的答案DIV同一div內的問題的div設置爲顯示（如果是有道理的！）。任何幫助將不勝感激。 。答：

<div class="set"> 
<div class="question">What is the airspeed velocity of an unladen swallow?</div> 
<div class="answer">Although a definitive answer would of course require further measurements, published species-wide averages of wing length and body mass, initial Strouhal estimates based on those averages and cross-species comparisons, the Lund wind tunnel study of birds flying at a range of speeds, and revised Strouhal numbers based on that study all lead me to estimate that the average cruising airspeed velocity of an unladen European Swallow is roughly 11 meters per second, or 24 miles an hour. </div> 
</div> 

<div class="set"> 
<div class="question">What is the airspeed velocity of an unladen swallow?</div> 
<div class="answer">Although a definitive answer would of course require further measurements, published species-wide averages of wing length and body mass, initial Strouhal estimates based on those averages and cross-species comparisons, the Lund wind tunnel study of birds flying at a range of speeds, and revised Strouhal numbers based on that study all lead me to estimate that the average cruising airspeed velocity of an unladen European Swallow is roughly 11 meters per second, or 24 miles an hour. </div> 
</div> 

<div class="set"> 
<div class="question">What is the airspeed velocity of an unladen swallow?</div> 
<div class="answer">Although a definitive answer would of course require further measurements, published species-wide averages of wing length and body mass, initial Strouhal estimates based on those averages and cross-species comparisons, the Lund wind tunnel study of birds flying at a range of speeds, and revised Strouhal numbers based on that study all lead me to estimate that the average cruising airspeed velocity of an unladen European Swallow is roughly 11 meters per second, or 24 miles an hour. </div> 
</div> 

Answer 1

如果我正確理解你的問題，你應該 通過將所有答案隱藏在CSS的啓動{顯示：無;}

然後你可以使用jQuery來顯示正確回答點擊的問題：

$(document).ready (function() { 
    $('.question').click(function() { 
     $(this).next('.answer').show(); 
    }); 
}); 

編輯：你也可以使用.toggle（）而不是.show（）來顯示/隱藏。

Answer 2

你或許應該看看這個question有類似的東西做。

基本上，你首先需要設置ID對您的元素，這樣就可以識別一組類中的單個元素。

然後，您可以添加一個點擊事件處理程序，它將設置選定的項目並顯示相應的答案。

你可以看到語法在documentation here搶奪兄弟姐妹。