Jquery multiple forms in same page
<p>I have the following dynamically generated HTML</p>

<pre><code>&lt;div id="1"&gt;
&lt;form name = "inpForm"&gt;
&lt;input name="FirstName" type="text"/&gt;
&lt;input type="submit" value="Submit"/&gt;
&lt;/form&gt;
&lt;/div&gt;

&lt;div id="2"&gt;
&lt;form name = "inpForm"&gt;
&lt;input name="FirstName" type="text"/&gt;
&lt;input type="submit" value="Submit"/&gt;
&lt;/form&gt;
&lt;/div&gt;
</code></pre>

<p>The outer divs have different IDs but the form names are the same. I am using Jquery to perform some validation when the form is submitted. However, when the second form is submitted, I always get the values of the first form.</p>

<pre><code>$(document).ready(function () {
    $('form[name="inpForm"]').live('submit', function () {
        alert($('input[name="FirstName"]').val());
        return false;
    });
});
</code></pre>

<p>How can I modify myJquery to find the "FirstName" element that matches the current form where the submit was triggered? 
Thanks</p>
