jsFiddle

• Run
• Edit

• JavaScript
• HTML
• Result

var app = {
    
    log: document.id('log'),
    
    config: {  
        clickMessage: 'Hi! clicked!',
        mouseOverMessage: 'Mouseover!'
    },
    
    clickHandler: function() {
        this.log.set('html',this.config.clickMessage);
    },
    
    nested: {
        mouseOverHandler: function() {  
           this.log.set('html',this.config.mouseOverMessage);  
        }
    }  
};

$('foo').addEvents({
  'click': app.clickHandler.bind(app),
  'mouseover': app.nested.mouseOverHandler.bind(app)
});

<h1 id="log">Waiting</h1>
<p id="foo">
    I am foo. <br/>Click me.
</p>