How to clear the HTML content of some id in jquery? - php

Question

I'm using smarty template, php and ajax. I've following code snippet from my smarty template:
<td align="left" id="subject_container" colspan="2" valign="top">
<form>
<table cellpadding="0" cellspacing="10" border="0" width="68%">
<tr>
<td align="center">
{if $subject_details}
Subjects
</td>
{assign var='i' value=0}
{foreach from=$all_subjects item=subjects}
</tr>
<tr>
<td align="left" valign="top" width="150">
{foreach from=$subject_details item=subject}
{if $subject.cs_subject_id==$subjects.subject_id}{$subjects.subject_name}{/if}
{/foreach}
</td>
{assign var='i' value=$i+1}
{/foreach}
</tr>
{/if}
</table>
</form>
</td>
The jQuery function is like as follows :
function get_subjects_by_class(class_id) {
var field_id = 'subjects';
$.ajax({
url: "teacher_details.php",
type: "POST",
data: {'request_type':'ajax', 'op':'get_assigned_subject_list', 'class_id':class_id},
success: function(data) {
$('#subject_container').append(data);
}
});
}
Now what I want to achieve is every time the function gets called the content of id="subject_container" should get clear and replaced with the new content which will come as a response from php file. I googled for it but couldn't get the satisfactory solution. Can anyone help me out in this regard? Thanks in Advance.

Answer 1

$.ajax({
url: "teacher_details.php",
type: "POST",
data: {'request_type':'ajax', 'op':'get_assigned_subject_list', 'class_id':class_id},
success: function(data) {
//$('#subject_container').append(data);
$('#subject_container').html(data);//<-- here
}
});
}

Answer 2

Change
$('#subject_container').append(data);
to
$('#subject_container').html(data);