Question

Let’s say I have this code:

<div id="content">
</div>

and I use a simple ajax request to fill the content with data which work when I click some button

    $.get("page?num=" + pageNumber, function(data){
                $("div#content").html(data);
});

one time the data will be

<div id="Data1">
</div>

and other time it will be

<div id="Data2">
</div>

for each id I have differnet jquery functions. for exampe:

$('#Data1').click(function(){});

some of the functions are similar and some are different.

My question – if I click the button I load all the scripts I need. when I click the other button I need to load the scripts again for the new content, but what happens to the old functions that was relevant to the previous content? Each time I click I load new scripts without deleting the last ones.

How do I delete/manage my scripts correctly?

thanks,
Alon

Answer 1

I am not sure if i understood your question. are you expecting something like

$("div#content").html(""); // deleting existing data
$("div#content").html(new_data); //loading new data