title: changing attribute of a tag with jquery in document.ready duplicate it
body: <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>