adding click event in newly created div in javascript

Question

I am creating a new div on a click of button and inside that onclick function I am adding a click event to newly created div but its not working.

document.getElementById('blah').onclick = function(){
    var innerDiv = document.createElement("div");
    document.getElementById('container').appendChild(innerDiv);
innerDiv.onclick =createWorkFunction;
}
function createWorkFunction(e){
 alert();
}

can anybody quickly help me

Answer 1

Your code is corrct, But you did not set the text of the your div (an empty div can not be clicked by an user), Try this:

document.getElementById('blah').onclick = function(){
    var innerDiv = document.createElement("div");
    innerDiv.innerHTML = 'This is a div'; // set it's text
    document.getElementById('container').appendChild(innerDiv);
    innerDiv.onclick = createWorkFunction;
}
function createWorkFunction(e){
    alert('this is some text');
}

Also it's better to use addEventListener

Answer 2

(function() {
    var oBlah = document.getElementById('blah');
    oBlah.addEventListener('click', function() {
        var innerDiv = document.createElement("div");
        document.getElementById('container').appendChild(innerDiv);
    }, false);
    innerDiv.addEventListener('click', function() {
        alert();
    }, false);
})();

This should help.

Answer 3

try this:

innerDiv.setAttribute("onclick","createWorkFunction()")   

function createWorkFunction(){
 alert("working");
}