jQuery Event on Dynamically added element not firing
<p>I've been searching for how to do this and I've seen a lot of options (most of which are deprecated), but nothing I've tried has worked. </p>

<p>I have a file upload script that dynamically adds table rows and one <code>&lt;td&gt;</code> has some <code>&lt;button&gt;</code> elements that I need to do some Ajax work on click, but I can't seem to make it do anything.</p>

<p>Here's the <code>&lt;td&gt;</code>that contains the button that gets added to the DOM:</p>

<pre><code>&lt;td class="filedelete"&gt;
    &lt;button class="btn btn-danger delete"&gt;
        &lt;i class="icon-trash icon-white"&gt;&lt;/i&gt; Delete
    &lt;/button&gt;
&lt;/td&gt;
</code></pre>

<p>This is the jQuery I am trying now: </p>

<pre><code>$(".delete").on("click", function(event){
    console.log("clicked");
});
</code></pre>

<p>Is <code>.on</code> what I should be using? What am I doing wrong?</p>
