If you’re already using jQuery and you need an EventEmitter you may as well use jQuery’s event system instead of building your own. Here’s something I used in a recent project:

EDIT: made it simpler. (Now mixin: jQuery.eventEmitter instead of jQuery.EventEmitter.prototype.)

(function(jQuery) {
  jQuery.eventEmitter = {
    _JQInit: function() {
      this._JQ = jQuery(this);
    emit: function(evt, data) {
      !this._JQ && this._JQInit();
      this._JQ.trigger(evt, data);
    once: function(evt, handler) {
      !this._JQ && this._JQInit();
      this._JQ.one(evt, handler);
    on: function(evt, handler) {
      !this._JQ && this._JQInit();
      this._JQ.bind(evt, handler);
    off: function(evt, handler) {
      !this._JQ && this._JQInit();
      this._JQ.unbind(evt, handler);

It’s a mixin, and you can use it like so:

function App() {
  // do stuff
jQuery.extend(App.prototype, jQuery.eventEmitter);
var myApp = new App();
// myApp supports events!
myApp.on('someEvent', function() {
myApp.emit('someEvent'); // 'someEvent' alerted

Feel free to change the property/method names. The stuff prefixed with _JQ should not be accessed publicly and should avoid conflicts with your objects. I guess you could use jQuery’s expando to hide them better. Or, alternatively, if performance is less of a concern, you can re-construct the jQuery object on each method-call instead of saving it.

When destroying your object be sure to call jQuery.removeData(myObj) too.

Thanks for reading! Please share your thoughts with me on Twitter. Have a great day!