Слушатель событий не работает последовательно Javascript

Question

У меня есть веб-викторина, которая загружает новый вопрос с 4 вариантами и соответствующими переключателями рядом с ними. Проблема в том, что у меня есть прослушиватель событий на «следующей» кнопке, которая запускает новый вопрос и выбор, который загружается, за исключением того, что вопросы не загружаются. Я считаю, что это потому, что счетчик шагов я сбрасываю каждый раз. Кроме того, что-то странное в том, что я получаю его вывод на консоль, когда запускается прослушиватель событий, а иногда, когда я нажимаю дальше, он не запускается, а иногда это происходит. Я не могу найти шаблон.

Я включил соответствующий код со ссылкой на JSFiddle, если вы хотите его просмотреть. Заранее спасибо. http://jsfiddle.net/d0u6cz7o/

function Quiz() { 
    this.step = 0; 

    this.questionSwap = function() { 
     document.getElementById('question').innerHTML = allQuestions[this.step].question; 
     document.getElementById('answer0').innerHTML = allQuestions[this.step].choices[0]; 
     document.getElementById('answer1').innerHTML = allQuestions[this.step].choices[1]; 
     document.getElementById('answer2').innerHTML = allQuestions[this.step].choices[2]; 
     document.getElementById('answer3').innerHTML = allQuestions[this.step].choices[3]; 
}; 


var quiz = new Quiz(); 
quiz.questionSwap(); 

window.addEventListener('load', function() { 
    document.getElementById("next").addEventListener("click", function() { 
    console.log("Here"); 
    quiz.questionSwap(); 
    quiz.step++; 
    console.log("current question is " + quiz.step); 

    }) 
}); 

Answer 1

Изменение представить в кнопку, удалить слушателю & изменить порядок ротации:

<input id="next" type="button" value="Next!"> 


document.getElementById("next").addEventListener("click", function() 
{ 
    quiz.step++; 
    quiz.questionSwap(); 
    console.log("current question is " + quiz.step); 

}) 

http://jsfiddle.net/d0u6cz7o/4/