Open and scroll to accordion section

Question

I have a single page site with content placed inside an accordion. I need to both open and scroll to the accordion item when a user clicks on my nav at the top of the page. I found a couple similar functions, this being the closest (Open JQuery accordion when link with an id of element within the accordion is clicked) but unfortunately the jsfiddle links are no longer working.

Right now I just have thecode to get the accordion working...Need to get the scroll to part in there somehow...Thanks!

Code

var accordion_head = $('.accordion > li > .toggle-bar');

accordion_head.on('click', function (event) {
    var $a = $(this);
    event.preventDefault();
    
    if ($a.hasClass('active')) {
        $a.removeClass('active').siblings('.content-wrapper').slideUp();
    }
    else {
        $a.addClass('active').siblings('.content-wrapper').slideDown();
    }
});

.accordion li .content-wrapper {
    display: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


<ul class="accordion">
  <li id="1">
   <a class="toggle-bar" href="#one"><h2>Headline</h2></a>
   

   <div class="content-wrapper">
          
            Content Here
          
            </div>
        </li>
  
        <li id="2">
   <a class="toggle-bar" href="#two"><h2>Headline</h2></a>
   

   <div class="content-wrapper">
          
            Content Here
          
            </div>
        </li>
  
        <li id="3">
   <a class="toggle-bar" href="#three"><h2>Headline</h2></a>
   

   <div class="content-wrapper">
          
            Content Here
          
            </div>
        </li>
  
</ul>