jQuery bind on form submit is not working
<p>I have a form like this:</p>

<pre><code>&lt;form class="category_form" id="category_form" method="post"&gt;
&lt;p class="ui-widget"&gt;
    &lt;label for="birds"&gt;Birds: &lt;/label&gt; 
    &lt;input id="birds" /&gt; &lt;a id="add_category" href="#"&gt;Add Category&lt;/a&gt;
&lt;/p&gt;

&lt;p class="ui-widget" style="margin-top:2em; font-family:Arial"&gt;
    Result:
    &lt;textarea id="log" style="height: 200px; width: 300px; overflow: auto;" class="ui-widget-content"&gt;&lt;/textarea&gt;
&lt;/p&gt;

&lt;p&gt;
    &lt;input type="submit" class="button" value="Add"&gt;
&lt;/p&gt;
&lt;/form&gt;
</code></pre>

<p>and I have a jQuery bind function like this:</p>

<pre><code>$('#category_form').bind('submit',function()
{
    // Get the variables

    alert ("hello");

    return false;
});
</code></pre>

<p>What I wanted to have happen is every time submit button is pressed, the jQuery function would fire and the alert would happen, but for some reason it isn't working as I thought it would.</p>

<p>The live example is on this test page: <a href="http://problemio.com/test.php" rel="nofollow">http://problemio.com/test.php</a></p>

<p>Any idea why pressing the add button does not make the above jQuery work?</p>

<p>Thanks!!</p>
