JSFiddle - React, Tailwind, and code Playground

HTML

<button id="next" counter="0">NEXT</button>
<p id="question">Hello world!</p>

JavaScript

var allQuestions = [{question: "If you were a super hero what powers would you have?",
            choices: ["a", "b", "c", "d"],
            correctAnswer:0},

            {question: "Do you have a cherished childhood teddybear?",
                choices: ["e", "f", "g", "j"],
                correctAnswer:0},

            {question: "Whats your favourite non-alcoholic drink?",
                choices: ["i", "j", "k", "l"],
                correctAnswer:0},

            {question: "Are you religious?",
                choices: ["m", "n", "o", "p"],
                correctAnswer:0}];

$('#next').click(function(){
            //var hasLooped = false;
            var counter = parseInt($("#next").attr("counter"));
                   alert(counter); $('#question').text(allQuestions[counter].question);
            $("#next").attr("counter",counter+1);
        });
              
    });