Syomga,
добавил удаление и клонирование (удаление первого запрещено, по желанию)
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
</style>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script>
$(function() {
let clone = $('#line').clone();
initDatepicker('#date');
$('#line .btn').remove();
function initDatepicker(id) {
$(id).datepicker({
showOn: 'focus',
altFormat: "mm.dd.yy",
dateFormat: "mm.dd.yy",
});
}
function deleteElement(line) {
$('.btn', line).click(_ => line.remove())
}
let num = 0;
function cloner() {
let line = clone.clone().appendTo('#action');
deleteElement(line);
let dateInput = $('.date', line).attr('id', `date${++num}`);
initDatepicker(dateInput);
}
$('#add').click(cloner);
});
</script>
</head>
<body>
<div id="action">
<div class="row" id="line" style="margin-bottom: 10px;">
<div class="col-md-5">
<input type="text" id="date" class="form-control date" placeholder="Дата" name="new_date[]">
</div>
<div class="col-md-5">
<input type="text" class="form-control" placeholder="Сумма" name="new_sum[]">
</div>
<div class="col-md-2">
<div class="btn-group">
<button type="button" class="btn btn-danger" id="del">- Удалить</button>
</div>
</div>
</div>
</div>
<button type="button" class="btn" id="add">- Добавить</button>
</body>
</html>