Error opening multiple calendars with Javascript!

Question

Good afternoon guys,

My question is that my table comes with comic information and connects in the view by an append, I added a calendar to them.

append code:

$("#table"+data[i].date+"").append(

                  '<tbody>'+
                  '<tr>'+
                    '<td scope="row"><p contenteditable="true" id="descri'+date[j].id+'">'+date[j].descri+'</p></td>'+
                    '<td><p contenteditable="true" id="proj'+date[j].id+'">'+date[j].projeto+'</p></td>'+
                    '<td><p contenteditable="true" id="pack'+date[j].id+'">'+date[j].pacote+'</td>'+
                    '<td><p contenteditable="true" id="cliente'+date[j].id+'">'+date[j].cliente+'</td>'+
                    '<td>'+date[j].type+'</td>'+
                    '<td>'+
                        '<div class="input-group ldate" id="calendar'+date[j].id+'" data-target-input="nearest">'+
                            '<input type="hidden" class="form-control datetimepicker-input idate" id="dataEdit'+date[j].id+'" data-target="#calendar'+date[j].id+'"/>'+
                            '<div class="input-group-append"  data-target="#calendar'+date[j].id+'" data-toggle="datetimepicker">'+
                                '<span class="form-control icon-border"><i class="far fa-calendar-alt icon"></i></span>'+
                            '</div>'+
                        '</div>'+
                    '</td>'+
                    '<td><p contenteditable="true" class="teste" id="'+date[j].id+'">'+date[j].hrStart+'-'+date[j].hrEnd+'</p></td>'+
                    '<td><p id="hrWork'+date[j].id+'">'+date[j].hrWork+'</td>'+
                    '<td class="text-right"><buttom class="btn btn-primary botao mr-1 edit" id='+date[j].id+'><i class="fas fa-save"></i></buttom><buttom class="remove btn btn-danger botao" id='+date[j].id+' ><i class="fas fa-trash-alt"></i></buttom></td>'+


                  '</tr>'+
                  '</tbody>'+
                 ' </table>'
                );

Until then beauty, the calendars open normal, but I can only collect the value of the calendar of the first Row.

Function of the calendar:

function date(id2, id3){
$( "#"+id2).datetimepicker({
    defaultDate: new Date(),
    format: 'L',
    locale: 'ptbr',
    dayViewHeaderFormat: 'MMMM-YYYY'
})

$('#'+id2).on('focusout',function(){
    var span2 = $("#"+id3).val();
    console.log(span2);
})

}

View image: