How to add onclick to html element dynamically using javascript

Question

I can create a button element and add an onclick event, as shown below.

elem.onclick=function()
{
alert("qweqweqwe");
}        

How can I use a predefined function instead of defining a function inside an event? Sort of:

elem.onclick=func();

Answer 1

add an event element to an element that has a specific function to call:

elem.addEventListener("click", func, false); //where func is your function name

Answer 2

The best way that I have learned for myself is as shown below.

const li = document.createElement('li');
        li.innerText = "client";
        li.id ="key";
        li.className = "client-class";
        li.setAttribute("onclick","valid;");

Answer 3

1)

function myfunction(){
alert("hello");
}

elem.onclick=myfunction();

2)

var myfunction=function(){
alert("hello");
}
elem.onclick=myfunction;
//or
elem.onclick=myfunction.call();

Answer 4

var clickHandler = function(){

};

elem.onclick = clickHandler;

---

function clickHandler(){

};

elem.onclick = clickHandler;

---

functions javascript

, 1, .

, 2, , clickHandler function , .

elem.onclick = function(){};

onclick

. , , , . , w3c . , , .

Answer 5

javascript

<div id="test">Click me to alert</div>

-

    document.getElementById("test").onclick=callme;

function callme()
{
    alert("You have clicked me!");
}

Answer 6

HTML:

<button>Button</button>
<div id="buttons">
</div>

JS ( jQuery):

$('button').click(function(){
    var dyn_button = '<button onclick="javascript:test()">Dynamic button</button>'
    $('div#buttons').append(dyn_button + "<br>");
});


function test()
{
    alert(123);
}

http://jsfiddle.net/IceManSpy/FaXgr/