title: Calling a function from within itself
body: <p>I have several elements inside a container. All their events are handled inside a function <code>events()</code>.</p>
  
  <p>On click of a button inside the container, I replace the container's html with the response from an AJAX request.</p>
  
  <pre><code>function events() {
      $(".btn").on("click", function() {
       ...
      }); 
  
      $(".txt").on("keyup", function() {
       ...
      });
  
      $(".btn2").on("click", function() {
                  var xmlhttp;
                  if (window.XMLHttpRequest) {
                      xmlhttp = new XMLHttpRequest();
                  }
                  xmlhttp.onreadystatechange = function() {
                      if (xmlhttp.readyState == 4) {
                         $(".container").html(xmlhttp.responseText); 
                         events(); // ***
                      }
                  }
                  url = 'handlers/gethtml.ashx';
                  xmlhttp.open("GET", url, true);
                  xmlhttp.send(null);
          });
  }
  </code></pre>
  
  <p>Now, I need to rebind all the controls with events so after changing the html     <code>$(".container").html(xmlhttp.responseText);</code> I call the function within itself because the new html contains the same controls with the same events.</p>
  
  <p>Does this cause stack overflow? I have some performance issues so i was wondering if this maybe the cause. Also, is there any workaround, maybe a more elegant way to do this?</p>