Динамически создаваемые кнопки OnClick не работает

Question

Я следующий код, вызывается в $(document).ready():

btnHolders.appendChild(_createButton("Note", function(){ 
    showNote(); 
})); 

var _createButton = function(name, func){ 
    var btn = document.createElement("input"); 
    btn.type = "button"; 
    btn.id = "btn" + name; 
    btn.onclick = func; 
    btn.value = name; 

    return btn; 
}; 

Однако, когда я смотрю на источник, я получаю следующее:

<input type="button" id="btnNote" value="Note">

Answer 1

I немного изменил ваш код, поскольку вы вызывали функцию, которая ранее не была определена. Также почему бы не использовать jQuery, чтобы сократить код, поскольку вы уже включили его?

var btnHolders = $('#btnHolders'); 

_createButton("Note", showNote); 

function _createButton(name, func){ 
    var btn = $('<input/>').attr({ 
     'type': 'button', 
     'id': 'btn' + name, 
     'value': name 
    }).bind('click', func); 

    btnHolders.append(btn); 
}; 

function showNote() { 
    console.log('test'); 
} 

DEMO

Answer 2

использование живой нажмите на кнопку:

$("#btnNote").click(function(){  
    alert('i am here '); 
}) 

Answer 3

Если вам нужно сделать в JavaScript, смотрите это ...

См следующий скрипку ... [скрипка1]: http://jsfiddle.net/pfCdd/

function myFunction(){ 
    var btn=document.createElement("BUTTON"); 
    var t=document.createTextNode("CLICK ME"); 
    btn.appendChild(t); 
    document.body.appendChild(btn); 
    btn.onclick = myfunc; 
} 
myFunction(); 
function myfunc(){ 
    alert("hai"); 
}