Make delete button procedurally
<p>I have HTML:</p>

<pre><code>&lt;button id='pusher'&gt;pusher&lt;/button&gt;

&lt;ul id="sortable"&gt;
    &lt;li&gt;things here&lt;/li&gt;
&lt;/ul&gt;
</code></pre>

<p>And JavaScript:</p>

<pre><code>$(".del").click(function(e) {
    $(this).parent().remove();
});


$("#pusher").click(function(e) {
    var text = "test";
    var lix = $("&lt;li class='uix' /&gt;").text(text);
    lix.append($('&lt;button class="del"&gt;xx&lt;/button&gt;'));
    lix.appendTo($("#sortable"));
});
</code></pre>

<p>I'm trying to make the pusher button make new <code>&lt;li&gt;</code> elements with a delete button inside, then when delete button is pressed it deletes its <code>&lt;li&gt;</code> element...</p>

<p>But it is not deleting.</p>

<p>Any ideas?</p>
