Как сгенерировать html при помощи jquery?

Question

[zlFast]

Есть массив с объектами:

[{id: 1, label: 'test'},{id: 2, label: 'test1'},{id: 3, label: 'test2'},{id: 4, label: 'test3'},{id: 5, label: 'test4'},{id: 6, label: 'test5'}]

Нужно сгенерировать из него такую структуру:

<input type="checkbox" id='id1' name='test'/>
                            <label for='id1'>
                                test
                            </label>
<input type="checkbox" id='id2' name='test1'/>
                            <label for='id2'>
                                test1
                            </label>

и т.д.

Как правильно это сделать?

Answer 1

[GreatRash]

var data = [
  {id: 1, label: 'test'},
  {id: 2, label: 'test1'},
  {id: 3, label: 'test2'},
  {id: 4, label: 'test3'},
  {id: 5, label: 'test4'},
  {id: 6, label: 'test5'}
];

$.each(data, function(key, value) {
  var attr = $.extend(value, {
    'id': 'id' + value.id,
    'type': 'checkbox'
  });

  $('<input />').attr(attr).appendTo('body');
  $('<label />').attr('for', attr.id).text('text' + (key || '')).appendTo('body');
});

Answer 2

[Andreo]

$.each([{id: 1, label: 'test'},{id: 2, label: 'test1'},{id: 3, label: 'test2'},{id: 4, label: 'test3'},{id: 5, label: 'test4'},{id: 6, label: 'test5'}], function(item) {
    $('body').append('<input type="checkbox" id="id' + item.id + '" name="test"/><label for="id"'+ item.id + '">' + item.label + '</label>');
});

Как-то так...

Answer 3

[axeax]

var arr = [{id: 1, label: 'test'},{id: 2, label: 'test1'},{id: 3, label: 'test2'},{id: 4, label: 'test3'},{id: 5, label: 'test4'},{id: 6, label: 'test5'}];
for(var i = 0; i < arr.length; i++){
   $('селектор-куда-добавить-эту-структуру').append('<input type="checkbox" id="id'+arr[i].id+'" name="'+arr[i].label+'"/><label for="id'+arr[i].id+'">'+arr[i].label+'</label>');
}