Databases
StackOverflow2013
Postsdbo
POjQuery .empty() on AJAX constructed list not working
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POjQuery .empty() on AJAX constructed list not working
    text
    copied!<p>I have an unordered list (each list element contains some further markup but this should not matter) that is constructed (instantiated and appended) from an AJAX call to the DB. I want to clear the list before any following AJAX call results are made.</p> <pre><code>$('#list').empty() </code></pre> <p>Does not work for some reason (I have tried many alternative schema with .remove() and .not() as well with no success). I know I am targeting the items correctly because I can change the css etc. Best I can do is delete an element by class from within each li by:</p> <pre><code>$('list li .class').remove() </code></pre> <p>Am I doing something fundamentally wrong here?</p> <p>Btw the list elements are being rendered using Mustache but that should not matter as once rendered it is simply HTML markup, or am I wrong here too?</p> <p>Thanks for any help.</p> <hr> <p>[EDIT] Ok so no luck getting any decent AJAX response on jsfiddle so here is the essence AJAX function call:</p> <pre><code>function loadResults() { $.ajax({ 'type' : 'POST', 'url' : '/lib/ajax.php', 'data' : { 'data1' : $('#data1').text(), 'data2' : $('#data2').text(), 'data3' : $('#data3').text() }, 'success' : function(data) { data = JSON.parse(data); // remove old results and add new results iteratively $('#results ul').empty(); $.each(data, function(i, elem) { // Load the template $.get('/views/default/templates/elem_tpl.html', function(t) { tmpl = t; }); $(document).ajaxStop(function() { var template = Mustache.render(tmpl, elem); $('#results ul').append(template); }); }); } }); </code></pre> <p>}</p> <p>The HTML is literally just a basic list for testing purposes:</p> <pre><code>&lt;div id="results"&gt; &lt;ul&gt; &lt;/ul&gt; &lt;/div&gt; </code></pre> <p>If that helps any.</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload