jQuery .clone .insertAfter с новым ID

Question

Как я могу клонировать DIV, добавить его сразу после div и дать ему новый идентификатор?

У меня есть DIV с классом reflection, я хочу каждый экземпляр этого DIV, клонировали и встраивали сразу после оригинала, но с классом reflected (без класса, reflection) Как я могу сделать это с JQuery?

Вот моя текущая скрипка, но он не работает правильно ... http://jsfiddle.net/yUgn9/

Answer 1

Передайте функцию .after(), и он возвращает обновленный клон.

$('div.reflection').after(function() { 
    return $(this).clone().toggleClass('reflection reflected'); 
}); 

DEMO:http://jsfiddle.net/PFBVX/

---

В старых версиях JQuery, это сделать ...

$('div.reflection').each(function() { 
    $(this).after($(this).clone().toggleClass('reflection reflected')); 
}); 

DEMO:http://jsfiddle.net/PFBVX/1/

Answer 2

Я считаю, что вам нужен .each() из них, чтобы обращаться с ними по отдельности. То, что в данный момент делает код, это захват всех их и клонирование их после всех из них. Вместо этого вы хотите обрабатывать каждую из них по отдельности и вставлять клон после оригинала после изменения классов по желанию.

$(document).ready(function(){ 

    $('div.reflection').each(function() { 
     var org = $(this), 
      clone = org.clone(); 

     clone.removeClass('reflection').addClass('reflected') 
      .insertAfter(org); 
    }); 

});