Horizontal jQuery UI Menu!

This is my version to get a horizontal menu bar working with jQuery UI. I am still working on getting it 100% Accessible. Keyboard navigation currently do not work as expected for the top level menu items.

HTML

<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.4/themes/black-tie/jquery-ui.css">
<div id="navbar">
  <ul id="menu">
    <li><span class="ui-icon ui-icon-home"></span>Home</li>
    <li>Activity A
      <ul>
        <li>Option 1</li>
        <li><span class="ui-icon ui-icon-wrench"></span>Option 2</li>
        <li><a class="ui-widget" href="#">Option 3</a></li>
      </ul>
    </li>
    <li>Activity B
      <ul>
        <li>Option 4</li>
        <li>Option 5
          <ul>
            <li>Option 7</li>
            <li>Option 8</li>
            <li><hr /></li>
            <li>Option 9</li>
          </ul>
        </li>
        <li>Option 6</li>
      </ul>
    </li>
  </ul>
</div>

CSS

.ui-widget {
  font-size:0.8em;
}

#navbar {
  white-space:nowrap;
}

#menu > li {
  display:inline-block;
}

.ui-menu .ui-menu-item {
  padding-right:2em;
}

/* HACK TO GET ANCHORS WORKING */

.ui-menu .ui-menu-item a {
  text-decoration: none;
}

.ui-menu .ui-state-focus a, .ui-menu .ui-state-active a {
  color: inherit;
}

JavaScript

var downPosition = {my:"left top", at:"left bottom", collision:"flipfit"};
var rightPosition = {my:"left top", at:"right top", collision:"flipfit"};

$( "#menu" ).menu({
	position: downPosition,
	focus:function(event, item) {
		if ($("#menu").get(0) === $(item).get(0).item.parent().get(0)) {
			$(this).menu("option", "position", downPosition);
		} else {
			$(this).menu("option", "position", rightPosition);
		}
	}
});
	
$("#menu").attr("role", "menubar");
	
$("#menu > li > span").each(function() {
	if ($(this).hasClass("ui-icon-carat-1-e")) {
		$(this).removeClass("ui-icon-carat-1-e").addClass("ui-icon-carat-1-s");
	}
});