jQuery UI Accordion - Default functionality

HTML

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.css">
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<div id="accordion">
    
     <h3 class="major_title">Section 1</h3>
    <div>
        <p>Text inside first content block.</p>
    </div>
    
     <h3 class="major_title">Section 2</h3>
    <div>
        <p>Text inside second content block.</p>
    </div>
    
     <h3 class="major_title">Section 3</h3>
    <div>
        <p>Text inside third content block.</p>
    </div>
    
     <h3 class="major_title">Section 4</h3>
    <div>
        <p>Text inside fourth content block.</p>
    </div>
</div>

CSS

#accordion > div:focus {
    outline: -webkit-focus-ring-color auto 5px;
}

JavaScript

$("#accordion").accordion({
    collapsible: true,
    header: "h3.major_title",
    heightStyle: "content",
    create: function (event, ui) {
        //$(ui.panel).attr('tabindex', '0');
        // undo all applies roles
        $("#accordion").removeAttr("role");
        $("#accordion h3").each(function () {
            $(this).attr('role', 'link');
            $(this).attr('tabindex', '0');
        });
        $("#accordion > div").each(function () {
            $(this).attr('role', 'region');
        });
    }
});
$( "#accordion" ).on( "accordionactivate", function( event, ui ) {
  var open = $(ui.newHeader).context;
    $("#accordion > div").attr('tabindex','0');
   if (typeof open !== "undefined") {
           $(ui.newHeader).next().focus();
   }
} );

//$('h3.major_title').on('keydown', function(e){
//down = 40
//    var event = window.event ? window.event : e;
//    if  (event.keyCode == 40) {
//        if ($(this).attr('aria-expanded') == "true"){
//           $(this).parent('li').find('div').focus();
//        }
//    }

//});


//function checkKey(e) {
//    var event = window.event ? window.event : e;
//    console.log(event.keyCode)
//}