<!DOCTYPE html>
<html>

<head>
<title>The Fun Quiz</title>

<link rel="stylesheet" type="text/css" href="styledaquiz.css">

<div>
<script>
document.write("<h1>Hey There! Welcome to the Fun Quiz! After taking this quiz you will be 10 times smarter!</h1>");
</script>
</div>



<script>



var score = new Array;

function showScore()
{
  var total=0;
  for (i in score)
  {
    total+=score[i];
  }
  document.getElementById('score').innerHTML=total;

}

function check1()
{
  if(document.getElementById('a1correct').checked)
 // if(document.question1["q1"]["correct"].checked)
 // if(document.question1["q1"]["0"].checked)
  {
    document.getElementById('answer1').innerHTML="correct!";
    score[0]=1;
  }
  else
  {
    document.getElementById('answer1').innerHTML="wrong!";
    score[0]=0;
  }    
  showScore();
}


function check2()
{
  if(document.getElementById('a2correct').checked)
  {
    document.getElementById('answer2').innerHTML="correct!";
    score[1]=1;
  }
  else
  {
    document.getElementById('answer2').innerHTML="wrong!";
    score[1]=0;
  }
  showScore();
}



function check3()
{
  if(document.getElementById('a3correct').checked)
  {
    document.getElementById('answer3').innerHTML="correct!";
    score[2]=1;
  }
  else
  {
    document.getElementById('answer3').innerHTML="wrong!";
    score[1]=0;
  }
  showScore();
}




function check4()
{
  if(document.getElementById('a4correct').checked)
  {
    document.getElementById('answer4').innerHTML="correct!";
    score[3]=1;
  }
  else
  {
    document.getElementById('answer4').innerHTML="wrong!";
    score[1]=0;
  }
  showScore();
}




function check5()
{
  if(document.getElementById('a5correct').checked)
  {
    document.getElementById('answer5').innerHTML="correct!";
    score[4]=1;
  }
  else
  {
    document.getElementById('answer5').innerHTML="wrong!";
    score[1]=0;
  }
  showScore();
}



function check6()
{
  if(document.getElementById('a6correct').checked)
  {
    document.getElementById('answer6').innerHTML="correct!";
    score[5]=1;
  }
  else
  {
    document.getElementById('answer6').innerHTML="wrong!";
    score[1]=0;
  }
  showScore();
}



</script>



</head>
<body>


<div>
<h2>Question 1:Are lemons fruit or vegetables?</h2>

<img border="0" src="money lemons.jpg" alt="Pulpit rock" width="304" height="228">

<form name="question1">
<input type="radio" name="q1"><span>Apples</span><br>
<input type="radio" name="q1" id="a1correct"><span>Fruit<br></span>
<input type="radio" name="q1"><span>Vegetables<br></span>
<input type="radio" name="q1"><span>None of The Above<br><span>
<input type="button" value="submit answer" onclick="check1()">
</form>

<span id="answer1"></span>

</div>

<div>
<h2>Question 2:What is the most popular religion in Sri Lanka?</h2>

<img border="0" src="sri lanka.png" alt="Pulpit rock" width="304" height="228">

<form name="question1">
<input type="radio" name="q1"><span>Christianity<br></span>
<input type="radio" name="q1"><span>Islam<br></span>
<input type="radio" name="q1" id="a2correct"><span>Buddhism<br></span>
<input type="radio" name="q1"><span>Hinduism<br></span>
<input type="button" value="submit answer" onclick="check2()">
</form>

<span id="answer2"></span>
</div>



<div>
<h2>Question 3: What is the official language of the U.S.A?</h2>

<img border="0" src="usa.png" alt="Pulpit rock" width="304" height="228">

<form name="question1">
<input type="radio" name="q1"><span>English<br></span>
<input type="radio" name="q1" id="a3correct"><span>No official language<br></span>
<input type="radio" name="q1"><span>Mexican<br></span>
<input type="radio" name="q1"><span>Miley Cyrus<br></span>
<input type="button" value="submit answer" onclick="check3()">
</form>

<span id="answer3"></span>
</div>


<div>
<h2>Question 4: What is the temperature (Celsius) at which water freezes?</h2>

<img border="0" src="ice.jpg" alt="Pulpit rock" width="304" height="228">

<form name="question1">
<input type="radio" name="q1"><span>100°<br></span>
<input type="radio" name="q1"><span>32°<br></span>
<input type="radio" name="q1"><span>-5°<br></span>
<input type="radio" name="q1"id="a4correct"><span>0°<br></span>
<input type="button" value="submit answer" onclick="check4()">
</form>

<span id="answer4"></span>
</div>


<div>
<h2>Question 5: Which continent is Uruguay located in?</h2>

<img border="0" src="urugay.svg" alt="Pulpit rock" width="304" height="228">

<form name="question1">
<input type="radio" name="q1"id="a5correct"><span>South America<br></span>
<input type="radio" name="q1"><span>Africa<br></span>
<input type="radio" name="q1"><span>Russia<br></span>
<input type="radio" name="q1"><span>Hawaii<br></span>
<input type="button" value="submit answer" onclick="check5()">
</form>

<span id="answer5"></span>

</div>

<div>
<h2>Question 6: Ok last question: Is a platypus a mammal?</h2>

<img border="0" src="platypus.jpg" alt="Pulpit rock" width="304" height="228">

<form name="question1">
<input type="radio" name="q1"><span>No<br></span>
<input type="radio" name="q1"><span>I think it is a Marsupial<br></span>
<input type="radio" name="q1"><span>No it's a reptile<br></span>
<input type="radio" name="q1"id="a6correct"><span>Yes it's a mammal<br></span>
<input type="button" value="submit answer" onclick="check6()">
</form>

<span id="answer6"></span>

</div>




<h1>Score</h1>
<p>Current score: <span id="score">0</span></p>

<p id="demo">
Did You Like This Quiz?
</p>


<script>
function myFunction()
{
x=document.getElementById("demo");  // Find the element
x.innerHTML="Bless U and ur soul dear child";    // Change the content
}
</script>




<script>
function myFunction1()
{
x=document.getElementById("demo");  // Find the element
x.innerHTML=":( *cries*";    // Change the content
}
</script>




<button type="button" onclick="myFunction()">Yea!</button>

<button type="button" onclick="myFunction1()">Noooo!</button>








</body>