jQuery slideToggle - Loading Twice (Open - Then Close)

I modified line 39 of the JS with the .stop() and it works (I believe this is the behavior you want):

$(this).next('ul.sub-nav').stop().slideToggle();

https://jsfiddle.net/hc8cad7c/1/

Ok, Here is the second attempt with removing the slideToggle() and using slideUp() and slideDown() functions in place of and it appears working at first glance but I do not think it is fully worked out after a couple clicks...

Here are the lines I changed:

function accordion_links()
{
    $('.chevron-down').click(function()
    {
        if($(this).parent('li').hasClass('open'))
        {
            $(this).removeClass('chevron-up');
            $(this).addClass('chevron-down');
            $(this).parent('li').removeClass('open');
    $(this).next('ul.sub-nav').slideUp();
        }
        else
        {
            $(this).removeClass('chevron-down');
            $(this).addClass('chevron-up');
            $(this).parent('li').addClass('open');
    $(this).next('ul.sub-nav').slideDown();
        }
    })
}

And the fiddle: https://jsfiddle.net/hc8cad7c/2/

Try your slideToggle in else condition, because you only have if conditions without else and it always tries to do the animation.

And optionally, comment return false;, I had problems with this line, because sometimes toggle doesn't Works.

Sometimes, jQuery actions run twice if they get called many times. That happens because there are some pending actions in the execution queue which disturb the actions flow.

So I suggest using clearQueue() method in the beginning of your click method, that will guarantee clearing any uncompleted actions before starting the execution of your logic.

Here's the documentation of clearQueue() method https://api.jquery.com/clearQueue/