IE8 jquery load() not loading where specified
<p>I have the following form:</p>

<pre><code>&lt;div id="divSignup"&gt;
     &lt;form method="post" name="signupForm" id="signupForm"&gt;
          &lt;input type="text" id="email" name="email" value="" class="email2"/&gt;
          &lt;input type="hidden" id="SAMID" name="SAMID" value="" /&gt;
          &lt;input type="hidden" id="x_building" name="x_building" value="" /&gt;
          &lt;input type="hidden" id="x_street" name="x_street" value="" /&gt;

          &lt;div id="divSignupForm"&gt;
               &lt;cfinclude template="signup1.cfm"&gt;
          &lt;/div&gt;
     &lt;/form&gt;
&lt;/div&gt;
</code></pre>

<p>A template with submit button is dynamically loaded with the <code>&lt;cfinclude&gt;</code> tag.
OnSubmit of signup1.cfm, jQuery validates the form then changes the form name and id attributes and loads a new form, again with its own submit button.</p>

<pre><code>$('#divSignupForm').load('signup2.cfm',function(){
    $('#signupForm').attr({'name':'signupForm2','id':'signupForm2'});
})
</code></pre>

<p>This all works great in FF and Chrome and IE9 but not IE8.</p>

<p>In IE8, it seems to load the new form but not within the specified div. It seems to be loading BENEATH the specified div. When I alert the contents of the div with the following:</p>

<pre><code>alert($('#divSignupForm').html());
</code></pre>

<p>I get the following result, which clearly shows the <code>&lt;/FORM&gt;</code> end tag above the loaded content. <strong>NOTE: Neither of the included templates have <code>&lt;form&gt;</code> tags. There is only the single form tag set in the parent.</strong></p>

<p>Could it be some tag in the loaded form that IE8 doesn't like? Possible jQuery conflict? The site uses MooTools also.</p>

<p><img src="http://i.stack.imgur.com/PVe35.gif" alt="enter image description here"></p>
