jQuery unobtrusive form
<p>In order to validate a form like:</p>

<pre><code>&lt;input type="text" name="trueExplain" /&gt;
&lt;input type="text" name="true1" /&gt;
&lt;input type="text" name="true2" /&gt;
&lt;input type="text" name="true3" /&gt;
&lt;input type="text" name="true4" /&gt;
&lt;input type="text" name="true5" /&gt;
</code></pre>

<p>in order to validate fields before submit, I want to add an id for each input element:</p>

<pre><code>&lt;input type="text" name="true1" /&gt;
</code></pre>

<p>becomes:</p>

<pre><code>&lt;input id="true1" type="text" name="true1" /&gt;
</code></pre>

<p>Then, for each input element, I want to add a label:</p>

<pre><code>&lt;input type="text" name="trueExplain" /&gt;
&lt;input type="text" name="true1" /&gt;
etc
</code></pre>

<p>becomes:</p>

<pre><code>&lt;label for="trueExplain"&gt;&lt;/label&gt;
&lt;input id="trueExplain" type="text" name="trueExplain" /&gt;
&lt;label for="true1"&gt;&lt;/label&gt;
&lt;input id="true1" type="text" name="true1" /&gt;
etc
</code></pre>

<p>I need some guidance both in design and implementation with jQuery. </p>
