Jquery datepicker не работает динамически

Есть страница, где размещен инпут для вводы даты. Инпут реализован через datepicker. При загрузке страницы при помощи jquery генерирую новый инпут для ввода даты. И естественно делаю инициализацию для него. Проблема в том, что когда начинаешь тыкать даты в календаре, в инпуте не заполняются выбранные даты. Для первого инпута все работает, а с генерированным такая проблема. Не могу понять, в чем проблема. Код инпута:

<div class="form-group form-group-date col-md-4 col-sm-7 col-xs-12 col-w-calc input_date" data-type="days">
<label for="surcharge[1][period-days]" class="hidden-xs">Даты</label>
<div class="input-group datepicker datepicker-surcharge">
    <select class="form-control js-surcharge-period" multiple="multiple" name="surcharge[1][period-days]" id="surcharge[1][period-days]"></select>
    <span class="input-group-btn">
        <button class="btn btn-default js-btn-datepicker" type="button"><i class="glyphicon glyphicon-calendar"></i></button>
    </span>
</div>

Функция инициализации и как делаю генерацию нового инпута:

$('.js-btn-datepicker').datepicker({
        format: 'dd M',
        language: 'ru',
        multidate: true,
        multidateSeparator: ', '
    }).on('changeDate', function(e) {
        var show = e.format('', 'dd M'),
            input = $(this).closest('.datepicker-surcharge').find('.js-surcharge-period');
        input.empty().trigger('change');
        $.each(e.dates, function( index, value ) {
            if (input.find("option[value='" + e.format(index, 'dd M') + "']").length == 0) {                        
                var newOption = new Option(e.format(index, 'dd M'), value, true, true);
                input.append(newOption).trigger('change');                                  
            }
        }); 
    });
    var input = $('.input_date').clone();
    input.insertAfter('.input_date');
    input.find('.js-btn-datepicker').datepicker({
        format: 'dd M',
        language: 'ru',
        multidate: true,
        multidateSeparator: ', '
    }).on('changeDate', function(e) {
        var show = e.format('', 'dd M'),
            input = $(this).closest('.datepicker-surcharge').find('.js-surcharge-period');
        input.empty().trigger('change');
        $.each(e.dates, function( index, value ) {
            if (input.find("option[value='" + e.format(index, 'dd M') + "']").length == 0) {                        
                var newOption = new Option(e.format(index, 'dd M'), value, true, true);
                input.append(newOption).trigger('change');                                  
            }
        }); 
    });