changing attribute of a tag with jquery in document.ready duplicate it
<p>I have a <code>button input</code> and I'm going to disable it like this :</p>

<pre><code>$(document).ready(function() {
                if ($('#participants tr').length &lt; 3 )
                    jQuery("#send").attr('disabled', true);
                else
                    jQuery("#send").attr('disabled', false);
            });
</code></pre>

<p>It disables successfully but when enable condition is true,this part is duplicated in a nested way:</p>

<p><strong>Edit:</strong></p>

<pre><code>&lt;form&gt;
 &lt;fieldset&gt;
 &lt;table id="participants"&gt;
  ....
 &lt;/table&gt;
  &lt;/fieldset&gt;
&lt;/form&gt;

&lt;input type="button" value="send" onClick="sendMail()" id="send" /&gt;
&lt;fieldset&gt;
...
&lt;form&gt;
 &lt;table id="participants"&gt;
    &lt;tr&gt;
      &lt;td&gt;&lt;a onClick='f(id)' &gt;del&lt;/a&gt;&lt;/td&gt;
    &lt;/tr&gt;
 &lt;/table&gt;
&lt;/form&gt;
&lt;/fieldset&gt;
&lt;input type="button" value="send" onClick="sendMail()" id="send" /&gt;
</code></pre>

<p>this <code>table</code> has some rows of participants that each row has a del link that clicking it cause deleting participant from database and table,when number of rows in table is less than 3 I'm going to disable <code>send button</code>
why?</p>
