Better way to "find parent" and if statements
<p>I can't figure out why this isn't working:</p>

<pre><code>$(document).ready(function() {
    if ($('.checkarea.unchecked').length) {
       $(this).parent().parent().parent().parent().parent().parent().parent().removeClass('checked').addClass('unchecked');
}
else {
    $(this).parent().parent().parent().parent().parent().parent().parent().removeClass('unchecked').addClass('checked');
}
});
</code></pre>

<p>Here's a screenshot of the HTML structure: <a href="http://cloud.lukeabell.com/JV9N" rel="nofollow">http://cloud.lukeabell.com/JV9N</a> (Updated with correct screenshot)</p>

<p>Also, there has to be a better way to find the parent of the item (there are multiple of these elements on the page, so I need it to only effect the one that is unchecked)</p>

<p>Here's some other code that is involved that might be important:</p>

<pre><code>$('.toggle-open-area').click(function() {
        if($(this).parent().parent().parent().parent().parent().parent().parent().hasClass('open')) {
              $(this).parent().parent().parent().parent().parent().parent().parent().removeClass('open').addClass('closed');
          }
          else {
              $(this).parent().parent().parent().parent().parent().parent().parent().removeClass('closed').addClass('open');
          }
    });


    $('.checkarea').click(function() {
        if($(this).hasClass('unchecked')) {
              $(this).removeClass('unchecked').addClass('checked');
              $(this).parent().parent().parent().parent().parent().parent().parent().removeClass('open').addClass('closed');
          }
          else {
              $(this).removeClass('checked').addClass('unchecked');
              $(this).parent().parent().parent().parent().parent().parent().parent().removeClass('closed').addClass('open');
          }
    }); 
</code></pre>

<p>(Very open to improvements for that section as well)</p>

<p>Thank you so much!</p>

<p>Here's a link to where this is all happening: <a href="http://linkedin.guidemytech.com/sign-up-for-linkedin-step-2-set-up-linkedin-student/" rel="nofollow">http://linkedin.guidemytech.com/sign-up-for-linkedin-step-2-set-up-linkedin-student/</a></p>

<hr>

<h2>Update:</h2>

<p>I've improved the code from the comments, but still having issues with that first section not working.</p>

<pre><code>$(document).ready(function() {
if ($('.checkarea.unchecked').length) {
    $(this).parents('.whole-step').removeClass('checked').addClass('unchecked');
}
else {
    $(this).parents('.whole-step').removeClass('unchecked').addClass('checked');
}
});
</code></pre>

<p>--</p>

<pre><code>  $('.toggle-open-area').click(function() {
        if($(this).parents('.whole-step').hasClass('open')) {
              $(this).parents('.whole-step').removeClass('open').addClass('closed');
          }
          else {
              $(this).parents('.whole-step').removeClass('closed').addClass('open');
          }
    });


    $('.toggle-open-area').click(function() {
        $(this).toggleClass('unchecked checked');
        $(this).closest(selector).toggleClass('open closed');
    });


    $('.checkarea').click(function() {
        if($(this).hasClass('unchecked')) {
              $(this).removeClass('unchecked').addClass('checked');
              $(this).parents('.whole-step').removeClass('open').addClass('closed');
          }
          else {
              $(this).removeClass('checked').addClass('unchecked');
              $(this).parents('.whole-step').removeClass('closed').addClass('open');
          }
    }); 
</code></pre>
