mootools menu document.id to document.getElements

我有一个小的mootools下拉菜单脚本。它适用于单个div。我如何修复这个类，使其按类（而不是按id）工作，并为多个菜单传递多个div？

HTML（单菜单）：

<ul id="nav">
   <li>
     <a href="#">Link1</a>
     <ul>
        <li>
          <a href="#">Sub Link1</a>
        </li>
     </ul>
   </li>
   <li>
     <a href="#">Link2</a>
   </li>
</ul>

呼叫菜单类：

document.id('nav').MooDropMenu({
   onOpen: function(el){
      el.fade('in');
      el.getParent('li').addClass('dropdown');
   },
   onClose: function(el){
      el.fade('out');
      el.getParent('li').removeClass('dropdown');
   },
   onInitialize: function(el){
      el.fade('hide').set('tween', {duration:0});
   }
});

这是针对单个文档id的。如何使用.getElements（）.转换多个div的源代码

MooDropMenu类：

var MooDropMenu = new Class({
    Implements: [Options, Events],
    options: {
        onOpen:         function(el){el.removeClass('close').addClass('open')},
        onClose:        function(el){el.removeClass('open').addClass('close')},
        onInitialize:   function(el){el.removeClass('open').addClass('close')},
        mouseoutDelay: 100,
        mouseoverDelay: 0,
        listSelector: 'ul',
        itemSelector: 'li',
        openEvent: 'mouseenter',
        closeEvent: 'mouseleave'
    },
    initialize: function(menu, options, level){
        this.setOptions(options);
        options = this.options;
        var menu = this.menu = document.id(menu);
        var that = this;
        menu.getElements(options.itemSelector + ' > ' + options.listSelector).each(function(el){
            this.fireEvent('initialize', el);
            var parent = el.getParent(options.itemSelector),
                timer;
            parent.addEvent(options.openEvent, function(){
                parent.store('DropDownOpen', true);
                clearTimeout(timer);
                if (options.mouseoverDelay) timer = this.fireEvent.delay(options.mouseoverDelay, this, ['open', el]);
                else this.fireEvent('open', el);
            }.bind(this)).addEvent(options.closeEvent, function(){
                parent.store('DropDownOpen', false);
                clearTimeout(timer);
                timer = (function(){
                    if (!parent.retrieve('DropDownOpen')) this.fireEvent('close', el);
                }).delay(options.mouseoutDelay, this);
            }.bind(this));
        }, this);
    },
    toElement: function(){
        return this.menu
    }
});
/* So you can do like this $('nav').MooDropMenu(); or even $('nav').MooDropMenu().setStyle('border',1); */
Element.implement({
    MooDropMenu: function(options){
        return this.store('MooDropMenu', new MooDropMenu(this, options));
    }
});