javascript - 在动态生成的复选框列表中附加额外的行

Question

我有一个基于 json 对象使用 jquery 动态生成的复选框列表，我需要在动态生成的复选框顶部添加一个带有复选框“全选”的多行，有关如何执行此操作的任何建议？

复选框列表如下所示：

 - select all (need to add)
 - dynamically generated 1
 - dynamically generated 2
 - dynamically generated 3
 - ...etc

代码如下：

function createCheckbox(filtered_array, div_name) {
    var container = $('ul#' + div_name);

    $.each(filtered_array, function (iteration, item) { 
        container.append(
            $(document.createElement("li"))
            .append(
                $('<input />').attr({
                    id: item
                    , name: item
                    , value: item
                    , type: 'checkbox'
                    , checked: true
                })
                //onclick get list of values selected 
                .click(function () {
                    selected_array1 = $('#1_list input:checked').map(function () { return this.id; }).get();
                    selected_array2 = $('#2_list input:checked').map(function () { return this.id; }).get();
                    selected_array3 = $('#3_list input:checked').map(function () { return this.id; }).get();
                    selected_array4 = $('#4_list input:checked').map(function () { return this.id; }).get();
                })
            )
            .append(
                $(document.createElement('label')).attr({
                    'for': item
                })
            .text(item)
            )
        )
    });
}