Search code examples
javascriptjqueryreloadhtml-lists

Replacing/reloading input list with jQuery and leaving first element

I created jQuery function that gets bunch of simple objects that contains id and title.

Then I run simple loop to create list:

$.each(data['results'], function(key, val) {
    items.push('<label for="radio_show_' + val['id'] + '" >' 
        + '<input type="checkbox" name="radio_show" class="checkbox" id="radio_show_' + val['id'] + '" value="'+ val['id'] + '" >'
        + val['title'] 
        + '</label>');
});

But now I don't know how to do the cleaning part.

I want to append this list to certain <ul>, I could do that with .appendTo(), but each time i would call this, it would add more and more lists. So before appending I would need to delete <ul> contains with .empty(). But the main problem is that I want to keep first element that would be same input just with no value and title of "Select all" (You get the idea).

Solution

  • Could you use something like this to 'clear' the ul -

    $("ul > li:not(:first)").remove()

    That should remove all the items in the ul aprt from the first one.

    Working demo - http://jsfiddle.net/zUuE9/