title: The method 'after' does not work with elements not yet in DOM
body: <p>I want to add two HTML elements to a Dom element one after another. But this call does not work with jQuery</p>
  
  <pre><code>$("&lt;button&gt;click me&lt;/button&gt;").after("&lt;span&gt; or be happy &lt;/span&gt;")
                                .appendTo("#someId");
  </code></pre>
  
  <p>The reason I cannot combine the two elements in one string is that I want to add a event handler to the first. So what I really want to do is:</p>
  
  <pre><code>$("&lt;button&gt;click me&lt;/button&gt;").after("&lt;span&gt; or be happy &lt;/span&gt;")
                                .on("click", function() {
                                    // do something
                                });
  </code></pre>
  
  <p>Right now, my workaround is to assign an id to the button and add the "span" in a separate jQuery call. Like so...</p>
  
  <pre><code>$('&lt;button id="uid"&gt;click me&lt;/button&gt;').on("click", function() {
                                              // do something
                                             });
  $('#uid').after('&lt;span&gt; or be happy&lt;/span&gt;');
  </code></pre>
  
  <p>It there a better way?</p>