Javascript-форум - .each для плагина

Javascript-форум (https://javascript.ru/forum/)

- jQuery (https://javascript.ru/forum/jquery/)

- - .each для плагина (https://javascript.ru/forum/jquery/25658-each-dlya-plagina.html)

.each для плагина

Здравствуйте.
Подскажите пожалуйста.
Пишу плагин, в котором мне нужно создать 20 дивов в одном диве. У этих 20 дивов отличается только id.

return this.each(function() {
    	var context = {
    		options				: options,
    		target 				: $(this),
                cards               : $(document.createElement("div")).attr({ "id" : "cards" }),
             // Add First Card
            firstCard           : $(document.createElement("div")).attr({ "class" : "card", "id" : "firstCard" }),
            // Add Second Card
            secondCard          : $(document.createElement("div")).attr({ "class" : "card", "id" : "secondCard" }),
            // Add Third Card
            thirdCard           : $(document.createElement("div")).attr({ "class" : "card", "id" : "thirdCard" }),

ниже

function initialize(context)
{
  cards = context.cards,

  // Add First Card
  firstCard = context.firstCard,
   // Add Second Card
  secondCard = context.secondCard,
  // Add Third Card
  thirdCard = context.thirdCard;
cards.append(firstCard);
cards.append(secondCard);
cards.append(thirdCard);
Ї

Как видете, код мягко говоря, не очень.
Если у меня будет 100 дивов внутри дива card, то я задолбаюсь их добавлять руками.
Вопрос:
как пожно с помощью each или если есть другой способ, добавить динамически єлементы в другой элемент?
Очень нужна помощь! :(

Цитата:

$(document.createElement("div")).attr({ "class" : "card", "id" : "thirdCard" })

Можно, кстати, делать компактнее:

$('<div/>',{ "class" : "card", "id" : "thirdCard" })

Цитата:

function initialize(context)
{
  *!*
cards = context.cards,
*/!*
  // Add First Card
  firstCard = context.firstCard,
   // Add Second Card
  secondCard = context.secondCard,
  // Add Third Card
  thirdCard = context.thirdCard;
cards.append(firstCard);
cards.append(secondCard);
cards.append(thirdCard);

А здесь var не помешает, хотя подобное присваивание бессмысленно в данном случае.

По вопросу:

var ids = ['firstCard', 'secondCard', 'thirdCard' /* , ... */], // хотя я совершенно не понимаю, зачем здесь делать статичные айдишники.
  cards = $('<div/>',{ "id" : "cards" });

$.each( ids, function( index, id ){ //id === this, кому как удобно
  $('<div/>',{ "class" : "card", "id" : id }).appendTo( cards )
});

к сожалению, не работает :(

Что именно не работает?