Making an accordion from a multi-level HTML list I am writing some code to turn a multi level UL into an accordion:

$(document).ready(function () {

$('.s4-ql li ul').each(function (index) {
    $(this).hide();
});

$('.s4-ql ul li ul').each(function (index) {
    var length = 0;
    length = $(this).children().length;
    var CurrentItem = $(this).parent().find('a:first');
    CurrentItem.find('.menu-item-text').append('&lt;span style=\'float:right;font-size:0.8em;\'&gt;(' + length + ')&lt;/span&gt;');
});
$('.s4-ql ul li').hover(
  function () {
      $(this).find('a:first').next().slideToggle('normal');
  },
  function () {
      $(this).find('a:first').next().slideToggle('normal');
  }
);
});


Can anyone tell me whether I am being relatively efficient or whether there is anywhere that I can "trim the fat", so to speak? The code also counts the number of children and displays that number on the main parent.
It'll be good if you can provide your HTML markup. Without it I can do this:

jQuery(function($) {
    $('.s4-ql li ul').hide();
    $('.s4-ql ul li').hover(function() {
        $(this).find('a:first').next().slideToggle();
    }, function() {
        $(this).find('a:first').next().slideToggle();
    }).find('ul').each(function(index) {
        var $this = $(this);
        $this.parent().find('a:first .menu-item-text').append(['&lt;span style=\'float:right;font-size:0.8em;\'&gt;(', $this.children().length, ')&lt;/span&gt;'].join(''));
    });;
});