My button and hover were working before I started on the Javascript so im a bit confused as to why its not working or showing up now, This is my first javascript project so would love some help explaining my error and how I can fix it. Thank you
https://jsfiddle.net/AoifeLarkin/odqhxtmj/#&togetherjs=2GOviaBkd1
Link to JSFiddle of Code
<html>
<head>
<meta charset="utf-8">
<title>Animal Quiz</title>
<link href="Styles/styles.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="wrapper">
<h1>Animal Quiz</h1>
<!--Start Button for Quiz to Begin-->
<div class="start_button"><button>Start Quiz</button></div>
<!--Box for Quiz-->
<div class="box">
<header>
<h2>Question 1</h2>
</header>
<main>
<div class="q">
<!--Block Element-->
<!--<span>The biggest predator in the animal kingdom?</span>-->
<!--Inline Element-->
</div>
<div class="option_list">
<!--<div class="option">
<span>Whale</span>
</div>
<div class="option">
<span>Lion</span>
</div>
<div class="option">
<span>Crocodile</span>
</div>-->
</div>
</main>
<!--Footer for the quiz box-->
<footer>
<div class="total_q">
<span> 1 of 15 Questions</span>
</div>
<button class="next_button">Next Question</button>
</footer>
</div>
You shuld use debugger (or console). You have not definied the array questions.From this point on, the execution of the entire code will stop (so nothing will be working).