JSFiddle - React, Tailwind, and code Playground
HTML
<div id="QA">
<h2></h2>
<span id="buttons"></span>
<p id="mkttext"></p>
<p><strong>Points</strong> : <span>0</span></p>
<div id="demo"></div>
<br>
<div id="centerbutton">
<button id="restart" onClick="history.go(0)">Restart game</button>
</div>
</div>
JavaScript
var questionnaire = [
{
"question" : "Q: The earth is round",
"valid" : 1, // indicates the correct array number, use 0, 1...
"buttons" : ["False", "True"],
"answers" : [ "The correct answer is True"]
},
{
"question" : "Q: The correct answer is True",
"valid" : 1,
"buttons" : ["False", "True"],
"answers" : [ "The correct answer is True"]
},
{
"question" : "Q: Java = JavaScript",
"valid" : 0,
"buttons" : ["False", "True"],
"answers" : [ "The correct answer is False"]
},
{
"question" : "Q: Grapes explode when you put them in the microwave",
"valid" : 1,
"buttons" : ["False", "True"],
"answers" : [ "The correct answer is True"]
},
{
"question" : "Q: Shakespeare invented both chess and the basketball",
"valid" : 0,
"buttons" : ["False", "True"],
"answers" : [ "The correct answer is False"]
},
{
"question" : "Q: LoL stands for World of Warcraft",
"valid" : 0,
"buttons" : ["False", "True"],
"answers" : [ "The correct answer is False"]
},
{
"question" : "Q: The average human will shed 40 pounds of skin in a lifetime.",
"valid" : 1,
"buttons" : ["False", "True"],
"answers" : [ "The correct answer is True"]
},
{
"question" : "Q: A giraffe can clean its ears with its 121-inch tongue",
"valid" : 0,
"buttons" : ["False", "True"],
"answers" : [ "The correct answer is False"]
},
{
"question" : "Q: Nepal is the only country that doesn't have a rectangular flag",
"valid" : 1,
"buttons" : ["False", "True"],
"answers" : [ "The correct answer is True"]
},
{
"question" : "Q: The match was invented before the cigarette lighter",
"valid" : 0,
"buttons" : ["False", "True"],
"answers" : [ "The correct answer is False"]
},
{
"question" : "Game over, check your score below.",
}
];
var $qa =...