javascript - How to clone element with new id? - Stack Overflow

I have some elements on the page. Here is example of one element:

<div id="119" class="message">
<div class="messageAuthor">iggy</div>
<div class="messageBody messageMessage">hello</div>
<div class="messageDate messageCreate_date">12:13</div>
</div>

I get from server new items and items which were updated in JSON. Here is example of using JSON response:

$.each(ajaxResult.items, function(index) {
    for (var key in ajaxResult.items[index]) {
        if (ajaxResult.items[index].hasOwnProperty(key)) {
            if ($('.'+ajaxResult.controller + self.toUpperFirst(key)).length) {
                if ($('#'+ajaxResult.items[index].id).length) {
                    $('#'+ajaxResult.items[index].id).children('.'+ajaxResult.controller + self.toUpperFirst(key)).text(ajaxResult.items[index][key]);
                }
                else {
                    var prevIndex = parseInt(index) - 1;

                    $('#'+ajaxResult.items[prevIndex].id).after($('#'+ajaxResult.items[prevIndex].id).html());
                }

            }
        }
    }
});

I want to add new elements after existing elements. I don't know what the best way to do it. I need help.

I have some elements on the page. Here is example of one element:

<div id="119" class="message">
<div class="messageAuthor">iggy</div>
<div class="messageBody messageMessage">hello</div>
<div class="messageDate messageCreate_date">12:13</div>
</div>

I get from server new items and items which were updated in JSON. Here is example of using JSON response:

$.each(ajaxResult.items, function(index) {
    for (var key in ajaxResult.items[index]) {
        if (ajaxResult.items[index].hasOwnProperty(key)) {
            if ($('.'+ajaxResult.controller + self.toUpperFirst(key)).length) {
                if ($('#'+ajaxResult.items[index].id).length) {
                    $('#'+ajaxResult.items[index].id).children('.'+ajaxResult.controller + self.toUpperFirst(key)).text(ajaxResult.items[index][key]);
                }
                else {
                    var prevIndex = parseInt(index) - 1;

                    $('#'+ajaxResult.items[prevIndex].id).after($('#'+ajaxResult.items[prevIndex].id).html());
                }

            }
        }
    }
});

I want to add new elements after existing elements. I don't know what the best way to do it. I need help.

• javascript
• jquery

Share Follow edited Aug 9, 2011 at 8:35 Calum 5,32611 gold badge2424 silver badges2727 bronze badges asked Aug 9, 2011 at 8:31 MirgorodMirgorod 32.8k1818 gold badges5353 silver badges6363 bronze badges 4

• What's your question here? There are several functions you can use to clone elements or create elements, such as clone() and append() – Calum Commented Aug 9, 2011 at 8:34
• I want to clone existing element to create new alements from json response. But i need to increment id of newly created elements. – Mirgorod Commented Aug 9, 2011 at 8:44
• you can set the id attribute with jquery_element.attr('id', id_new_element) – Michael Koper Commented Aug 9, 2011 at 8:52
• Please edit in the pertinent details into the question, such as making it clear that your question is really about getting unique id's, and not about the actual cloning process. – Lasse V. Karlsen Commented Aug 9, 2011 at 10:13

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 9

jQuery(element).clone().attr('id',new_id).appendTo(parent_element);