JSFiddle - React, Tailwind, and code Playground

by Zach McCall

HTML

<h1>Simple Quiz</h1>
<div id="question"></div>
<div id=answers>
    <label><input type="radio" id="answer1" name="choice"></label>
    <label><input type="radio" id="answer2" name="choice"></label>
    <label><input type="radio" id="answer3" name="choice"></label>
    <label><input type="radio" id="answer4" name="choice"></label>
    <label><input type="radio" id="answer5" name="choice"></label>
</div>


<div id="btns">
    <button onclick="startfunction()" id="start">Start
    <button onclick="submitfunction()" id="submit">Submit
</div>

CSS

.btns{height:50px; width:80px; background-color:blue;
}

JavaScript

$(document).ready(main);

function main(){

var questions[
    {question:"What is the capital of Washington?", choices: ["Salem", "Seattle", "Helena", "Olympia"], correctanswer:"Olympia"}

    {question:"How many countries are in Europe?", choices:[ "15", "46", "27", "51"], correctanswer: "51"};

    {question:"What is the population of Mexico City?", choices:[ "3.3 Million", "800 Thousand", "15.1 Million", "8.9 Million"], correctanswer:"8.9 Million"}

	{question:"Who is the current leader of Russia?",choices:[ "Boris Yelstin", "Dmitry Medvedev", "Nikolai Bulganin", "Vladimir Putin"], correctanswer:"Vladimir Putin"}

	{question:"How large is the state of California?", choices:[ "85,115 square miles", "130,919 sauare miles", "215,355 saure miles", "163,696 square miles"], correctanswer:"163,696 square miles"}
]

function startfunction(){
    quiz();
    $("#start").hide();
    
}

total=0;
number=0;

function quiz(){
    $("#question").text(questions[number].question);
    $("#answers").text(questions[number].choices[0]);
    $("#answers").text(questions[number].choices[1]);
    $("#answers").text(questions[number].choices[2]);
    $("#answers").text(questions[number].choices[3]);
    $("#answers").text(questions[number].choices[4]);
  
}

/*
function submitfunction(){
    number++;
    if(){
        total++;
        alert("Your Score: "+total);
    }
    else{
        alert("Your Score: "+total);
    }
        
}
*/