Wie kann ich Elemente einer versteckten Klasse einzeln anzeigen?

Question

Ich versuche ein Quiz in Jquery zu erstellen, so dass der Benutzer nur eine Frage auf einmal sieht. Ich habe die 'Divs' mit PHP bevölkert. Ich kann die Liste der Fragen mit ausblenden: $(".questions).hide();

Aber wenn ich die ID eines Elements innerhalb der versteckten Klasse auswählen, wird es nicht angezeigt.

Hier ist ein Dummy-HTML:

$(document).ready(function() { 
 

 
    $(".questions").hide(); 
 
    $("#question1").show(); // this is not working. 
 

 

 
    $(".option").click(answeredQuestionBox); 
 
    $(".check-box").click(reviewQuestionBox); 
 

 
});

<div class="questions"> 
 
    <div id="question1"> 
 
    // question goes here with 'radio' input options. 
 
    </div> 
 
</div>

Answer 1

Sie müssen das Kind div von questions Element verstecken.

$(".questions > div").hide(); //$(".questions").children("div").hide() 
$("#question1").show(); 

Ich würde Ihnen empfehlen, eine CSS-Klasse zu Frage zuweisen.

<div class="questions"> 
    <div class="question" id="question1"> 
     // question goes here with 'radio' input options. 
    </div> 
</div> 

dann können Sie verwenden

$(".questions > div.questions").not("#question1").hide();