JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>
<head>
	<link type="text/css" rel="stylesheet" href="style.css"/>
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
	<script type="text/javascript" src="script.js"></script>
	
</head>
<body background="owl.jpg">

<div id="headline"><h1>The Harry Potter Quiz</h1></div>

<div id="questionBackground">
<button id="btn" class="next">Get next Question</button>
<div id="q"></div>
<form id="a"></form>

</div>
</body>
</html>

JavaScript

$(document).ready(function() {
	var allQuestions = [

		{question: "In order of birth, who are the seven Weasley siblings?",
		choices: ["Percy, Bill, George, Charlie, Fred, Ron, Ginny","George, Fred, Percy, Bill, Charlie, Ron, Ginny", "Bill, Charlie, Percy, Fred, George, Ron, Ginny"],
		correctAnswer:"2"},
	
	{question: "Who first shows Harry the diary of Tom Riddle?",
	choices: ["Moaning Myrtle","Ginny","Hermione"],
	correctAnswer:"0"},
	
	{question:"What is the only movie that doesn't feature Lord Voldemort?",
	choices:["The Sorcerer Stone","The Prisoner of Azkaban","The Deathly Hallows"],
	correctAnswer:"1"},
	
	{question:"What Hogwarts student is killed in Little Hangleton graveyard at the end of 'The Goblet of Fire'?",
	choices:["Cedric Diggory","Romilda Vane","Lavender Brown"],
	correctAnswer:"0"}

];
var questionNumber = -1;
var x;
var score = 0;

//start button
	document.getElementById("btn").addEventListener("click", hideQuestion, false);
	document.getElementById("btn").addEventListener("click", nextQuestion, false);
	document.getElementById("btn").addEventListener("click", seeResult, false);
	
function nextQuestion (){
	//add 1 to the counter for next question
	++questionNumber;	

	//create question
	var question = document.createElement("div");
	question.setAttribute("class", "question");
	question.setAttribute("id", "question"+questionNumber);
	question.innerHTML = allQuestions[questionNumber].question;
	
	//add to document
	document.getElementById("q").appendChild(question);

	//insert answer
	var answers = document.createElement("div");
	answers = document.createElement("div");
	answers.setAttribute ("class","answers");
	answers.setAttribute ("id","answers"+questionNumber);
	//add to answers div
	document.getElementById("a").appendChild(answers);
	answers.innerHTML = "<button type='button' class='as' id='c1' value='0' onclick='setIndID(this);'>" +allQuestions[questionNumber].choices[0]+"</button>" +"<button value='1' type='button' class='as'...