Advanced Mootools example

<div data-attach="Plugin1" data-plugin1-options="{x: 10}">
..
</div>
<div data-attach="Plugin2">
..
</div>

Window Events

(function (MyNameSpace, $) {

  window.addEvents({
    'domready': function () {
      Attach.run();
    },
    'domupdated': function () {
      Attach.run();
    }
  });

})(window.MyNameSpace = window.MyNameSpace || {}, document.id);

Plugin 1 with options.

(function (MyNameSpace, $) {
  
  MyNameSpace.Plugin1 = new Class({

        Implements: Options,
        
        options: { x: 1 },
 
        initialize: function (element, options) {
            this.element = $(element);
            this.setOptions(options);
            this.attach();
        },
 
        attach: function () {
          //Stuff
        }
  });

  Attach.add('Plugin1', function(el){
    if (el.retrieve('Plugin1') === null)
      el.store('Plugin1', new Plugin1(el, JSON.decode(el.get('data-plugin1-options'))));
  });

})(window.MyNameSpace = window.MyNameSpace || {}, document.id);

Plugin 2 causes re-attach.

(function (MyNameSpace, $) {
  
  MyNameSpace.Plugin2 = new Class({

        initialize: function (element) {
            this.element = $(element);
            this.attach();
        },
 
        attach: function () {
          //Stuff
        },
 
        load: function (path) {
          //Stuff that updated the DOM
          window.fireEvent('domupdated');
        }
  });

  Attach.add('Plugin2', function(el){
    if (el.retrieve('Plugin2') === null)
      el.store('Plugin2', new Plugin2(el));
  });

})(window.MyNameSpace = window.MyNameSpace || {}, document.id);