jQuery - Create new function on event
<p>In JavaScript/jQuery, if I want to have a function that can run on an element that has been appended to the DOM, it has to be created <em>after</em> the element has been appended to the DOM. How can I do this? I heard one can do this with the jQuery <code>.on()</code> function, but I'm not quite sure how.</p>

<p><em>HTML:</em></p>

<pre><code>&lt;span&gt;Hello Stackoverflow&lt;/span&gt;​
</code></pre>

<p><em>JavaScript:</em></p>

<pre><code>$("span").click(function () {
   addMyElement();
});

$("p").click(function () {
   removeMyElement(this);
});

function addMyElement() {
    $("&lt;p&gt;Hello World&lt;/p&gt;").appendTo("body");
}
function removeMyElement(myElement) {
    $(myElement).remove();
}
</code></pre>

<p>Example on <a href="http://jsfiddle.net/wowpatrick/wWXrK/5/" rel="nofollow">jsFiddle.net</a>.</p>
