textarea not rendering properly on an ajax load

I am having issue with loading a html textarea via ajax, essentially the text area's content is rendering outside of the textarea.

Here is the javascript call

function editForm(button,type,id)
{
if (id == null)
    id = -1;
$("#errMsg").html("");
parentID = button.parentNode.id;
cFormName = parentID.replace("controls_","");

$("#addAnother").load("getHTML.php", {addAnother:type,formID:cFormName,id:id}, 
    function() 
    {
        $("#"+cFormName).html($("#addAnother > form").html());//grab the form
        $("#"+parentID).html($("#addAnother > p").html());//grab the controls
    }//end function
);//end ajax load
}

Here is the response (I had to change the img tags to imageTag to post)

<form class="wrapped" id="additional-info0" method="post" action="http://192.168.2.107/resumes/getHTML.php">
<fieldset>
    <ol>
    <li>
        <label for="additional-info">Additional Information:</label>
        <textarea cols="75" type="text" name="additional-description[]" size="80" />asdfasdfdfasf</textarea>
        <a onclick="javascript:removeDescriptionPoint(this);"> <imageTag src="assets/img/delete.png" alt="Delete"></a><br />
        <p class="form_align">Maecenas blandit nulla sit amet urna posuere lacinia ultrices libero scelerisque. Pellentesque imperdiet iaculis ullamcorper. 
            <em>E.g. Mauris feugiat urna non lacus gravida in pulvinar dolor hendrerit.</em>
        </p>
    </li>
    <div id="editFields-additional-info0"></div>
    <li>
        <a href="javascript:addAnother('additional','additional-info0');" title="Add another description point" class="form_align">
            <imageTag src="a开发者_运维技巧ssets/img/add-another2.jpg" alt="Add Another" /> Add another description point
        </a>
    </li>
    </ol>
</fieldset>

Save Clear

---

 <textarea cols="75" type="text" name="additional-description[]" size="80" />asdfasdfdfasf</textarea>

You've terminated the textarea tag ...

<textarea ... /> <-- remove the /