I'm trying to use JQuery UI Accordion as a menu, but I can't figure out how to prevent some tabs from expanding.

My JS:

  $("#sidebar").accordion({
    collapsible: true,
    changestart: function(event, ui) {
       switch ($(ui.newHeader).attr("id")) {
         case "sidebar_grades":
           return false;
           break;
       }
    }
  });

the HTML:

<div id="sidebar">
  <h3 id="sidebar_home">
     <a href="/blah">Home</a>
  </h3>
  <div>
     <a href="/child">Settings</a>
  </div>
  <h3 id="sidebar_grades">
     <a href="/grades">Grades</a>
  </h3>
  <div></div>
  <h3 id="sidebar_calendar">
     <a href="/calendar">Calendar</a>
  </h3>
  <div></div>
</div>

In the above example, since #sidebar_grades doesn't have any child, it should not be expandable, but user can click on the link.

I tried using "changestart" event and return false when #sidebar_grades is clicked, but it doesn't work. I also tried attaching onClick event to #sidebar_grades to return false, but that didn't work either.

Any idea how to do this? Thank you!