no cambia el src de imagen en evento oclick agregado poo javascript

[gilber966]

Hola es que tengo este code pero no me funciona la llamada a una funcion que hago desde un evento en un clase:

el code:

Código Javascript:

(function(){
 
    var random = window.random = function(min, max){
        var rango_superior = max,
            rango_inferior = min,
            aleatorio = Math.floor(Math.random()*(rango_superior-(rango_inferior-1))) + rango_inferior;
            
        return aleatorio;
    }
 
 
    var idCount = 0;
    var protagonista = window.protagonista = function(){
    
        // atributos
        this.posY=0;
        this.caida;
        this.modo="";
        this.tramos=4;
        this.vidas=5;
        this.paracaidas=false;  
        this.id = "imgSold" + idCount;
        idCount++;
        
        this.ele= document.createElement('img');
        this.ele.src = 'amigo-normal-1.png';
        this.ele.id = this.id;
        this.ele.className = "sold";
        this.ele.onclick = function(e){
                       alert('obtuve el evento click');//este alert si me funciona
            this.ele.src = "amigo-cayendo-1.png";//aqui no hace nada
        };
        document.getElementById("main").appendChild(this.ele);
        
        // metodos
            this.iniciar = function(posx){
//alert(posx);
            var self = this;            
            this.mostrar();
            this.posX=posx;
            this.ele.style.left= String(this.posX) + "px";
            this.caida=setTimeout(function () { self.caer(); }, 50);
            
        }
        
        this.mostrar = function(){
            this.ele.style.visibility="visible"; 
        };
        
        this.ocultar = function(){
            this.ele.style.visibility="Hidden"; 
        };
        
        this.caer = function (){
            
            this.posY = this.posY + this.tramos;
            
            if(this.posY<=520){
                this.ele.style.top= String(this.posY) + "px";
                //this.ele.style.left= String(this.posX) + "px";                
                //document.getElementById('py').value=vel;
                //console.log("this.posY: " + this.posY);
                var self = this;
                this.caida=setTimeout(function () { self.caer(); }, 50);
            }
            else{
                clearTimeout(this.caida);
                this.posY=0;
                //alert("termine de caer");
                this.ele.src ="amigo-caminando-1.gif";                  
                if(paracaidas==false){
                    this.ocultar();
                    this.vidas=this.vidas-1;
                    document.getElementById('vidas').value=this.vidas;
                }               
            }
        }
        this.abrirParacaidas = function(){
            this.ele.src = "amigo-cayendo-1.png";
            
        };
        
        
    };
 
})();