This here is a quick-and-dirty implementation of folders for jQuery:

Markup

Any markup following the naming conventions should work, for example:

<ul class="collapsible">
  <li>
     <a href="" class="toggle-button">This be the folder</a>
    <ul style="display:none" class="collapsible-content">
        <li>This be the folder content</li>
        <li>This be the folder content</li>
    </ul>
  </li>
</ul>

JavaScript

/**
 * Collapsible categories implementation.
 * 
 */
var category = {
  find_category: function(target) {
    var category = target;
    // This isn't the category, so look for it
    if(!target.hasClass('collapsible')) {
      category = target.closest('.collapsible');
    }
    return category;
  },
  collapse: function(target) {
    var category = this.find_category(target);
    category.find('.collapsible-content').hide();
    category.removeClass('expanded');
    category.addClass('collapsed');
  },
  expand: function(target) {
    var category = this.find_category(target);
    category.find('.collapsible-content').show();
    category.addClass('expanded');
    category.removeClass('collapsed');
  },
  toggle: function(target) {
    var category = this.find_category(target);

    var is_expanded = category.hasClass('expanded');

    if(is_expanded) {
      this.collapse(category);
    } else {
      this.expand(category);
    }
  }
}

Usage

$('.toggle-button').live('click', function() {
  category.toggle($(this));
  return false;
});