Adding Event Listener to dynamically created divs

Question

I am trying to add click event listener to my divs that I am creating in my JS dynamically.

My Javascript snippet of function that is called each time to create the Div:

var listDiv = document.createElement("div");
listDiv.className = "list";
listDiv.addEventListener = ('click',gotoOutcomesLO, false);

The Function that is called by the click event:

function gotoOutcomesLO(e){
if(typeof(Storage)!=="undefined"){
        var ele = e.target;
        var text = ele.getAttribute("name");
        sessionStorage.test = text;
}
}

I don't see any click events added to my HTML and not sure what's wrong. Any pointers would be helpful! Thanks!

remove = in listDiv.addEventListener = ('click',gotoOutcomesLO, false); — user2587132
– user2587132, Commented May 27, 2014 at 5:44

eyllanesc · Accepted Answer · 2020-09-07 03:54:52Z

6

Change

listDiv.addEventListener = ('click',gotoOutcomesLO, false);

to

listDiv.addEventListener('click',gotoOutcomesLO, false);

edited Sep 7, 2020 at 3:54

eyllanesc

246k19 gold badges205 silver badges282 bronze badges

answered May 27, 2014 at 5:45

Kazekage Gaara

15.1k14 gold badges64 silver badges113 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

ZeroWorks · Accepted Answer · 2014-05-27 05:50:05Z

2

addEventListener is a function remove equal:

var listDiv = document.createElement("div");
listDiv.className = "list";
listDiv.addEventListener('click', gotoOutcomesLO, false);

function gotoOutcomesLO(e) {
    if(typeof(Storage)!=="undefined") {
        var ele = e.target;
        var text = ele.getAttribute("name");
        sessionStorage.test = text;
    }
}

Also I guess you append listDiv to a node...

answered May 27, 2014 at 5:50

ZeroWorks

1,6381 gold badge21 silver badges24 bronze badges

Comments

Pratik Parekh · Accepted Answer · 2014-05-27 05:49:53Z

0

Here is javascript click event

var listDiv = document.createElement("div");
listDiv.className = "list";
listDiv.onclick = function(){
   alert('onclick fired')
}

answered May 27, 2014 at 5:49

Pratik Parekh

4474 silver badges19 bronze badges

2 Comments

Pinoniq Over a year ago

don't use the onclick attribute :(

Pinoniq Over a year ago

Using a chainsaw to cut meat works. This still doesn't mean we should abandon the knife.

Collectives™ on Stack Overflow

Adding Event Listener to dynamically created divs

3 Answers 3

Comments

Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related