Make a JavaScript code that has a random question and random selections and only make one right and make the background color blue
<!DOCTYPE html>
<html>
<head>
<style>
body {
background-color: blue;
}
</style>
</head>
<body>
<h1 id="question"></h1>
<ul id="options">
<li id="option1"></li>
<li id="option2"></li>
<li id="option3"></li>
</ul>
<script>
const questions = [
{
question: "What is the capital of France?",
options: ["Paris", "London", "Berlin"],
answer: "Paris"
},
{
question: "Who wrote Romeo and Juliet?",
options: ["William Shakespeare", "Jane Austen", "Charles Dickens"],
answer: "William Shakespeare"
},
{
question: "What is the tallest mountain in the world?",
options: ["Mount Everest", "K2", "Kangchenjunga"],
answer: "Mount Everest"
}
];
const randomQuestion = questions[Math.floor(Math.random() * questions.length)];
document.getElementById("question").textContent = randomQuestion.question;
randomQuestion.options.forEach((option, index) => {
const li = document.getElementById(`option${index + 1}`);
li.textContent = option;
li.addEventListener("click", () => {
if (option === randomQuestion.answer) {
alert("Correct answer!");
} else {
alert("Wrong answer. Try again!");
}
});
});
</script>
</body>
</html>