如何选择新增加的dom

How to select the dom which new append?
Because there can be append not just one time and not the same order, so I thought the only way is when append new dom, then set variable equal this (in question 1) , but after append another, then they will both be change.. How to solve this?

also I'm wondering question 2 why console.log will print [] not string?

html

<div class="container">
    <!--append to here and insert value from ajax response in .id , each time click button will append new here, insert different id -->
</div>

<div class="button-insert">button</div>

<div class="inser-template">
    <div class="id"></div>
</div>

js

$('.button-insert').click(function() {
    $.ajax({
        url: 'getlastid',
        type: 'POST',
        data: {getlastid: 'getlastid'},
    })
    .done(function(response) {
        console.log(response); // ex. 1 or … the value from database field

// question 1 
        // after append another dom, they will both be change to new value from 'response'
        var $newInsert = $('.container').append($('.insert-template').html());
        $newInsert.find($('.id').html(response));

// question 2
        // get []
        // var lastid = $(response);
        // console.log(lastid);  
})
...

for question 2
php

...
// select db get last id + 1 or
$getlastid = '1';
return $getlastid;

For your first question, you could do this:

$($('.insert-template').html())
    .appendTo('.container')
    .find('.id')
    .html('response');

For number 2, I'm not sure what you're expecting. I think your response is '1'. Creating a jQuery object from that doesn't really make sense.