Why are both if and else conditions getting called in jQuery?

My problem is regarding using delegation, .on();

I've looked around and cannot find information here at stackoverflow for a possible solution to my problem.

Both of the conditions in my click event are getting fired or do not get fired at all. I've tried switching the conditions, and still both fire or don't fire at all, and I'm not sure why.

The current jQuery provided will not fire at all. If I remove or comment out all the code inside the else statement and add console.log('test') as a test, then you will see that both get fired.

Would someone be so kind and help me with what the problem is? Unfortunately I cannot simulate the environment through jsfiddle because this is a drupal site behind VPN, with a heck of a lot of dependencies.

The jQuery is as follows:

        // Depth 1 Menu Controls
        $('nav #block-superfish-1').on('click', 'li.menuparent.sf-depth-1 div.mobilesubnavarrow', function(){

            if(!$(this).hasClass('sf-expanded')){

                // Global
                $('li.menuparent.sf-depth-1').removeClass('sf-expanded');
                $('li.menuparent.sf-depth-1 div.mobilesubnavarrow').removeClass('sf-expanded');
                $('li.menuparent.sf-depth-1').find('ul').css({display: 'none'});

                $(this).addClass('sf-expanded');
                $(this).closest('li.menuparent.sf-depth-1').addClass('sf-expanded');
                $(this).closest('li.menuparent.sf-depth-1').find('ul').slideDown();

                return;
            } else {

                //$(this).removeClass('sf-expanded');
                $(this).closest('li.menuparent.sf-depth-1').removeClass('sf-expanded');
                $(this).closest('li.menuparent.sf-depth-1').find('ul').slideUp();
            }

        });

I also have another of the exact same jQuery for a 'Depth 2', with the only thing changing is the class .sf-depth-2, so there's no point in posting that here as well.

Thank you for your time.