title: Click listener to ajax loaded content. Pure javascript
body: <p>I have this javascript which loaded some content block by ajax</p>
  
  <pre><code>var sendContainer = document.getElementById("loadForm");
  
          sendContainer.addEventListener("click", function (event) {
  
        var xmlhttp;
              if (window.XMLHttpRequest) {
                  xmlhttp = new XMLHttpRequest();
              }
              xmlhttp.onreadystatechange = function () {
                  if (xmlhttp.readyState == 4 &amp;&amp; xmlhttp.status == 200) {
  
          // Show loaded content block in result div
                      document.getElementById("result").innerHTML = xmlhttp.responseText;
  
                  }
              };
              var form = document.getElementById('ajax_send_message');
              var formData = new FormData(form);
  
              xmlhttp.open("GET", '/ajax', true);
              xmlhttp.setRequestHeader("X-Requested-With", "XMLHttpRequest");
              xmlhttp.send(formData);
   });
  </code></pre>
  
  <p>And loaded content block</p>
  
  <pre><code>&lt;button type="button" id="ajax_submit""&gt;Send&lt;/button&gt;
  </code></pre>
  
  <p>How to force this addEventListener to get id (ajax_submit) from dynamically loaded block</p>
  
  <pre><code>document.getElementById("ajax_submit").addEventListener("click", function (event) {
  alert('WORK!');
  
  });
  </code></pre>