Проблема с добавлением datetimepicker в динамически добавляемые строки таблицы

Я работаю над проектом, в котором мне сложно добавить datetimepicker в динамически добавляемые строки таблицы. Я добавил datetimepicker в строки статической таблицы, и он отлично работает для них, но не работает для динамически добавленных строк таблицы.

Учебник, который я использую для datetimepicker

https://eonasdan.github.io/bootstrap-datetimepicker/

Мой код, который я пробовал: я клонирую скрытые строки.

Функция клонирования строки:

  // Table Add Function
  $('.table-add').click(function () {

    var $clone = $TABLE.find('tr.hide').clone(true).removeClass('hide table-line');            
    hid = $TABLE.find('tr.hide').attr('id');
    // //Assigning every table row a unique ID
    var max=0;
    $('table').find('tr').each(function(){
        var id=parseInt($(this).attr('id'));
        if (id>=max){
           max = id;
         }
     });

     //cloning row with new ID  
     $clone.attr('id', parseInt(max)+1);
     //always assign new id to new table row, will be easy to recognize rows
     $clone.find('input.myinput').attr('id', parseInt(max)+1);

     $clone.find("[name='datepicker']").datetimepicker();
     //$("[name='datepicker']").datetimepicker();

     $hiddentr = $('table').find('tr.hide');

     //add dynamic word picker to cloned rows dynamically
     $clone.find('td:nth-last-child(4)').after('{% if obj.word_picker == "Y" %} <td><input id = "wordpicker" style = "border:none"; data-role = "tagsinput" class = "myinput" name = "unique_tag"/></td>{% endif %}');
     $clone.appendTo( $('#'+hid).parent());
     //submitting form after row clone
     submitForm();
  });

HTML скрытого тд:

<td> 
   <div style = "position: relative"> 
     <input class = "form-control" type= "text" name = "datepicker" id= "datetime">
   </div> 
</td>