Javascriptクラス名でオブジェクトのリスナーを追加する

Question

動的に作成された要素にリスナーを追加する場合は、「クリック」する必要があります。あなたは、イベントの代表団が行くには良い方法だろう動的に追加された要素を言っているのと

Answer 1

（コンソールにエラーが存在しない）

function addListenerToElements(){ 
     var aTags = document.getElementsByClassName("classElements") 
     for (var i=0;i<aTags.length;i++){ 
      aTags[i].addEventListener('click',myFunction); 
     } 
    } 

    function myFunction() { 
     console.log("something"); 
    } 

が、それは動作しません：私のコードです。以下は、静的な要素の両方のために、だけでなく、動的に追加されたものをのために働く：

document.getElementById("container").addEventListener("click", function(e) { 
 
    if (e.target && e.target.matches("div.className")) { 
 
    console.log('element clicked', e.target.innerText); 
 
    // or call your function 
 
    } 
 
}); 
 
var index = 0; 
 
document.getElementById('add').addEventListener('click', function(e) { 
 
    var div = document.createElement('div'); 
 
    div.appendChild(document.createTextNode(index++)); 
 
    div.className = 'className'; 
 
    document.getElementById('container').appendChild(div); 
 
});

<div id="container"> 
 
    <div class="className">a</div> 
 
    <div class="className">b</div> 
 
    <div class="className">c</div> 
 
    <div class="className">d</div> 
 
    <div class="className">e</div> 
 
</div> 
 
<button id="add">Add Element</button>

Answer 2

[OK]をあなたは

addListenerToElements(); 

https://jsfiddle.net/xrqnn20f/1/関数を呼び出すまでは、ここで何かを逃したイベントが文句を言わない登録

addListenerToElements(); 
function addListenerToElements(){ 
     var aTags = document.getElementsByClassName("classElements") 
     for (var i=0;i<aTags.length;i++){ 
      aTags[i].addEventListener('click',myFunction); 
     } 
    } 

    function myFunction() { 
     console.log("something"); 
    }