title: Uncaught TypeError: Cannot read property 'parent' of null
body: <p>hello I am working on a project that if you click on a combination that a result comes out but when I press the button I look this error</p>
  
  <p><a href="https://i.stack.imgur.com/KwAhq.png" rel="nofollow noreferrer">error massage</a></p>
  
  <p>the error is on line 9 but unfortunately I can not figure it out and I also say that there is an error in error in the jquery.js but it leaves it externally</p>
  
  <pre><code>var current_fs, next_fs, previous_fs;
  var left, opacity, scale;
  var animating;
  $(".next").click(function(){
      if(animating) return false;
      animating = true;
  
      current_fs = $(this).parent();
      next_fs = $(this).parent().next();
  
      $("#progressbar li").eq($("fieldset").index(next_fs)).addClass("active");
  
      next_fs.show(); 
      current_fs.animate({opacity: 0}, {
          step: function(now, mx) {
              scale = 1 - (1 - now) * 0.2;
              left = (now * 50)+"%";
              opacity = 1 - now;
              current_fs.css({
          'transform': 'scale('+scale+')',
          'position': 'absolute'
        });
              next_fs.css({'left': left, 'opacity': opacity});
          }, 
          duration: 800, 
          complete: function(){
              current_fs.hide();
              animating = false;
          }, 
          easing: 'easeInOutBack'
      });
  });
  
  $(".previous").click(function(){
      if(animating) return false;
      animating = true;
  
      current_fs = $(this).parent();
      previous_fs = $(this).parent().prev();
      $("#progressbar li").eq($("fieldset").index(current_fs)).removeClass("active");
      previous_fs.show(); 
      current_fs.animate({opacity: 0}, {
          step: function(now, mx) {
              scale = 0.8 + (1 - now) * 0.2;
              left = ((1-now) * 50)+"%";
              opacity = 1 - now;
              current_fs.css({'left': left});
              previous_fs.css({'transform': 'scale('+scale+')', 'opacity': opacity});
          }, 
          duration: 800, 
          complete: function(){
              current_fs.hide();
              animating = false;
          }, 
          easing: 'easeInOutBack'
      });
  });
  
  $(".submit").click(function(){
      return false;
  })
  
  
  
  var $ = function (id) {
      return document.getElementById(id);
  };
  
  var man = $("man");
  var vrouw = $("vrouw");
  var kind = $("kind");
  var volwassen = $("volwassen");
  var vijfzestig = $("vijfzestig");
  var acne = $("acne");
  var grove = $("grove");
  var drogehuid = $("drogehuid");
  var beste = $("beste");
  var make = $("make");
  var jaer = $("jaer");
  var neeer = $("neeer");
  var hoofd = $("hoofd");
  var romp = $("romp");
  var benen = $("benen");
  
  var mixColours = function mixColours() {
  
      if (man.checked &amp;&amp; kind.checked &amp;&amp; acne.checked &amp;&amp; jaer.checked &amp;&amp; hoofd.checked ) {
          $("colourResult").innerHTML = "ttttt";
      } else if (man.checked &amp;&amp; volwassen.checked &amp;&amp; acne.checked &amp;&amp; jaer.checked &amp;&amp; hoofd.checked) {
          $("colourResult").innerHTML = "rood wit zc";
      } else if (man.checked &amp;&amp; vijfzestig.checked &amp;&amp; acne.checked &amp;&amp; jaer.checked &amp;&amp; hoofd.checked) {
          $("colourResult").innerHTML = "rood paars zv";
      }
  
      if (vrouw.checked &amp;&amp; kind.checked) {
          $("colourResult").innerHTML = "You made Yellow!";
      } else if (vrouw.checked &amp;&amp; volwassen.checked) {
          $("colourResult").innerHTML = "You made Light Yellow!";
      }
  
  };
  window.onload = function () {
      $("mixColours").onclick = mixColours;
  };
  </code></pre>
  
  <p>there is a piece that the buttons change the fieldset and there is an animation and the other that calculates what suits you best</p>
  
  <p>if there are any questions about exactly what the code is, then I would like to hear it</p>
  
  <p>thank you in advance</p>