In the following code:
$(document).ready(function() {
var content = "";
for (var i = 0; i < 1000; i++) {
content += "<div>Testing...</div>";
}
$("#Load").click(function() {
$("#MyDiv").empty();
$("#MyDiv").append(content);
return false;
});
});
Download is a simple link, and MyDiv is a simple div. In every major browser, I tested this, when I click on the link several times, I see that memory usage is growing in the task manager. In IE, it increases slightly each time and stays up. In FF, it goes up every time, but crashes from time to time (I think this means that the memory is being fixed or garbage collection is a good sign). In Chrome, it increases significantly every time and remains valid.
Firstly, does this code correctly clear the DOM? If so, why is memory usage increasing with every click?
Note. I tried to make the example as simple as possible, but it looks like a problem that I have in my application.