Kann keine funktionierende Funktion bekommen - Javascript

Question

Ich kann nicht eine Funktion arbeiten, wenn Sie Klassen-Tag verwenden. Mit ID versucht und richtig gearbeitet, aber ich brauche es mit einer Klasse. Derjenige, der nicht funktioniert, ist die Eingabeklasse = "nextButton".

Hier ist ein Teil meiner HTML-Code:

<div class="wrap"> 
      <h3>Question2</h3> 
       <p>Which National Team won the first World Cup?</p> 
        <div class="wraptext"> 
         <input type="radio" name="question2" value="Brazil" /><strong>Brazil</strong><br /> 
         <input type="radio" name="question2" value="France" /><strong>France</strong><br /> 
         <input type="radio" name="question2" value="Italy" /><strong>Italy</strong><br /> 
         <input type="radio" name="question2" value="Uruguay" /><strong>Uruguay</strong><br /> 
         <input class="nextButton" type="button" value="Next Question"> 
         <input class="prevButton" type="button" value="Previous Question"> 
        </div> 
     </div> 

Hier ist die Javascript:

var questions = document.getElementsByClassName("wrap"); 
var start = document.getElementById("startB"); 
var next = document.getElementsByClassName("nextButton"); 

for (var i = 0; i<questions.length; i++) { 
    questions[i].style.display="none" 
} 

start.addEventListener("click", showQuestions); 

function showQuestions(){ 
    questions[0].style.display=""; 
} 

next.addEventListener("click", nextQuestion); 

function nextQuestion(){ 
    alert("hi"); 
} 

Answer 1

Verwenden Sie diese Syntax ..

var next = document.getElementsByClassName('nextButton')[0];

Answer 2

Es aussieht wie du behandeln getElementsByClassName so, als würde sie einen einzelnen Wert anstelle eines arr ausgeben ja.

Schleifen Sie entweder durch das Array oder fügen Sie eine [0] hinzu, um nur auf das erste zurückgegebene Element zu verweisen.