I'm trying to clear the div's innerHTML before repopulating it. I tried removeData() but once that's called, when I try to add the data, I get nothing from the next line after remove whereas if I remove the removeData() it's fine again. I just want to clear out any previous content in that div before I re-populate it.
divToUpdate.removeData(); //clean out any existing innerHTML div content first
divToUpdate.html(data);
It looks like it never gets to my divToUpdate.html(data) for some reason after it calls that removeData();
To remove all child elements from your div:
$('#mysweetdiv').empty();
.removeData()
and the corresponding .data()
function are used to attach data behind an element, say if you wanted to note that a specific list element referred to user ID 25 in your database:
var $li = $('<li>Joe</li>').data('id', 25);
$('div').html('');
But why are you clearing, divToUpdate.html(data);
will completely replace the old HTML.
var $div = $('#desiredDiv');
$div.contents().remove();
$div.html('<p>This is new HTML.</p>');
That should work just fine.
you should be able to just overwrite it without removing previous data
divToUpdate.innerHTML = "";
jQuery Data is a different concept than HTML. removeData is not for removing element content, it's for removing data items you've previously stored.
Just do
divToUpdate.html("");
or
divToUpdate.empty();
Source: Stackoverflow.com