simple validation on form
<p>
I have to made simple validation form using jquery, ( <strong>no 3rd party plugins</strong>)
for this i wrote following code..</p>

<pre><code>&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
    &lt;head&gt;
        &lt;title&gt;&lt;/title&gt;
        &lt;link rel="stylesheet" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css" /&gt;
        &lt;style&gt;
        .InvaildField {
             border: 0.5px solid red;
        }
    &lt;/style&gt;
        &lt;script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"&gt;&lt;/script&gt;
        &lt;script type="text/javascript" src="http://code.jquery.com/ui/1.9.1/jquery-ui.js"&gt;&lt;/script&gt;
        &lt;script type="text/javascript"&gt;
            $(document).ready(function () {
                $('#btnSubmit').attr("disabled", true);
                $('.emptyField').blur(function () {
                    if ($(this).val() == '') {
                        $(this).removeAttr('class');
                        $(this).addClass('InvaildField');
                        $('#btnSubmit').attr("disabled", true);
                    } else {
                        $(this).removeAttr('class');
                        $('#btnSubmit').attr("disabled", false);
                    }
                });
                $('.emptyField').keyup(function () {
                    if ($(this).val() == '') {
                        $(this).removeAttr('class');
                        $(this).addClass('InvaildField');
                        $('#btnSubmit').attr("disabled", true);
                    } else {
                        $(this).removeAttr('class');
                        $('#btnSubmit').attr("disabled", false);
                    }
                });
            });
        &lt;/script&gt;
    &lt;/head&gt;
        &lt;body&gt;
            &lt;table&gt;
                &lt;tr&gt;
                    &lt;td&gt;Name&lt;/td&gt;
                    &lt;td&gt;&lt;input  class="emptyField" type="text"/&gt;&lt;/td&gt;
                &lt;/tr&gt;
                &lt;tr&gt;
                    &lt;td&gt;Email&lt;/td&gt;
                    &lt;td&gt;&lt;input class="emptyField" type="text"/&gt;&lt;/td&gt;
                &lt;/tr&gt;
                &lt;tr&gt;
                    &lt;td&gt;Mobile Number&lt;/td&gt;
                    &lt;td&gt;&lt;input class="emptyField" type="text"/&gt;&lt;/td&gt;
                &lt;/tr&gt;
                &lt;tr&gt;
                    &lt;td colspan="2"&gt;
                        &lt;input id="btnSubmit" class="emptyField" type="button" value="Submit"/&gt;
                    &lt;/td&gt;
                &lt;/tr&gt;
            &lt;/table&gt;
        &lt;/body&gt;
    &lt;/html&gt;
</code></pre>

<p>but <strong>problem is when i fill first text box , button is enable</strong>, how to enable button when all texboxes are not null , </p>

<p><a href="http://jsfiddle.net/xA7hH/" rel="nofollow">http://jsfiddle.net/xA7hH/</a></p>
