Problema con jQuery

[berper]

Hola que tal, he estado intentando de muchas formas como solucionar un problema que tengo con jquery que no he podido solucionar y espero me puedan ayudar.

Tengo un codigo similar a este:

Código Javascript:

var botones = {
 
cargar:function(){
    $('body').prepend('<button class="boton">Hola</button>');
    $('button.boton').click(function(){this.ocultar();});
    },
    
ocultar:function(){$('button.boton').css('display')=='none';}
};
 

Lo que se supone que debe hacer es crear un boton justo despues de la etiqueta body y que al hacer click se oculte.

Se que podria definirle el atributo "onclick", pero lo que busco es como llamar a la funcion "ocultar" desde el evento "click".

Espero que alguien tenga alguna idea de como solucionarlo, gracias.

[SergeMedina]

El problema es que this dentro del callback del evento se refiere al elemento button.button del DOM, por lo que no tendra un metodo ocultar. Lo que necesitas hacer es guardar una referencia a this dentro de cargar y asi poder llamar el metodo ocultar.

Código Javascript:

var that = this;
//...
//dentro del callback
that.ocultar()
 

O bien:

Código HTML:

botones.ocultar();
 

Te recomiendo que leas sobre scope y closures en JS.

Saludos

[berper]

@SergeMedina

Gracias por tu respuesta, leeré como recomiendas sobre scope y closures.

Saludos.