title: comparing responses in dynamic quiz with jquery
body: <p>hi im totally noob at jquery im trying to leanr so i decided to make a dynamic quiz in order to improve my skills i've been doing it one step at a time an then try to wrap it all togheter. I got stuck in the way of how to check wich one of my checkbox is checked to compare if its the correct answer and then update the question and the answers. here is my html:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang='es'&gt;
  &lt;head&gt;
  &lt;meta charset='UTF-8'&gt;
  &lt;title&gt;Dynamic Quiz&lt;/title&gt;
  &lt;link rel="stylesheet" type="text/css" href="css/normalize.css"&gt;
  &lt;link rel="stylesheet" type="text/css" href="css/estilos.css"&gt;
  &lt;script type="text/javascript" src="js/jquery.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="js/prefixfree.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="js/codigo.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;header&gt;
      &lt;hgroup&gt;
          &lt;h1&gt;This is my Dynamic Quiz&lt;/h1&gt;
          &lt;h2&gt;Using html5 / css / javascript&lt;/h2&gt;
      &lt;/hgruop&gt;
  &lt;/header&gt;
  
  &lt;section id='description'&gt;
      &lt;p&gt;This quiz is compossed by 10 questions, you have to answer at least 7
         from 10 to pass the exam.&lt;/p&gt;
      &lt;h2&gt;Lets start!&lt;/h2&gt;
  &lt;/section&gt;
  
  &lt;div id='questions-number'&gt;
      &lt;p&gt;Question &lt;span id='current-question'&gt;1&lt;/span&gt; of &lt;span&gt;10&lt;/span&gt; &lt;/p&gt;
  &lt;/div&gt;
  
  &lt;section id='questions'&gt;
      &lt;p id='question'&gt;&lt;/p&gt;
  
      &lt;ul&gt;
          &lt;li&gt;&lt;input type='checkbox' id='checkAnswer0'/&gt;&lt;label id='answer0'&gt;answer0&lt;/label&gt;&lt;/li&gt;
          &lt;li&gt;&lt;input type='checkbox' id='checkAnswer1'/&gt;&lt;label id='answer1'&gt;answer1&lt;/label&gt;&lt;/li&gt;
          &lt;li&gt;&lt;input type='checkbox' id='checkAnswer2'/&gt;&lt;label id='answer2'&gt;answer2&lt;/label&gt;&lt;/li&gt;
          &lt;li&gt;&lt;input type='checkbox' id='checkAnswer3'/&gt;&lt;label id='answer3'&gt;answer3&lt;/label&gt;&lt;/li&gt;
      &lt;/ul&gt;
  &lt;/section&gt;
  
  &lt;div id='next'&gt;
      next
  &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>and this is what i got in jquery so far :)</p>
  
  <pre><code>$(document).on('ready', ready);
  function ready(){
  var allQuestions =
  [
      {
          question1: "Whats my real name?",
          choices1: ["Jhonnatan", "Alberto", "Tatan","Jaime"],
          answer1: 0
      },
  
      {
          question2: "Who is Colombia's president?",
          choices2: ["Alvaro Uribe", "Andres Pastrana", "Juan Manuel Santos","Tatan"],
          answer2: 2
      },
  
      {
          question3: "My favorite super heroe?",
          choices3: ["Batman", "Flash", "Tatan","Javascript"],
          answer3: 3
      },
  
      {
          question4: "Wich sports do i practice?",
          choices4: ["Climbing", "Swimming", "Programming","Running"],
          answer4: 0
      },
  
      {
          question5: "Whats my dad's name?",
          choices5: ["Alberto", "Jorge", "Javier","Jose"],
          answer5: 1
      },
  
      {
          question6: "Whats my favorite color?",
          choices6: ["Red", "Purple", "Blue","All"],
          answer6: 2
      },
  
      {
          question7: "My favorite alcoholic drink",
          choices7: ["Vodka", "Aguardiente", "Rum","Tekila"],
          answer7: 3
      },
  
      {
          question8: "Whats my favorite kind of music?",
          choices8: ["Hardcore", "Reggaeton", "Salsa","Programming"],
          answer8: 0
      },
  
      {
          question9: "How many qestions has this quiz??",
          choices9: ["20", "8", "10","12"],
          answer9: 2
      },
  
      {
          question10: "My favorite programming lenguage?",
          choices10: ["Ruby", "Arduino", "Python","Javascript"],
          answer10: 3
      }
  ];
  var question = $('#question');
  var choice1 = $('#answer0');
  var choice2 = $('#answer1');
  var choice3 = $('#answer2');
  var choice4 = $('#answer3');
  
  question.text(allQuestions[0].question1);
  choice1.text(allQuestions[0].choices1[0]);
  choice2.text(allQuestions[0].choices1[1]);
  choice3.text(allQuestions[0].choices1[2]);
  choice4.text(allQuestions[0].choices1[3]);
  console.log('funcionando!');
  
  var next = $('#next');
  next.on('click', changeQuestion);   
  function changeQuestion(){
      var checked = $('#checkAnswer0');
      if($checked.prop('checked')){
          console.log('correcto')else{
              console.log('no es correctp'); 
          }
      }
  }
  }
  </code></pre>
  
  <p>i will appreciate your help if you help me with this! :)</p>