JavaScript — добавить новое текстовое поле, динамически выбирать и ставить флажки

Я пытаюсь сделать форму в HTML / Javascript / PHP с выберите список флажок и текстовое поле плюс одна кнопка добавления.

эта форма должна работать так:

• Шаг 1 Когда страница загружена, текстовые поля должны быть отключены и выберите
  поле активно
• Шаг 2 Когда я выбираю флажок, текстовое поле
  включен и выбор отключен.
• Шаг 3 Когда я нажимаю кнопку добавления, он должен добавить: 1 флажок, 1 текстовое поле и 1 вариант выбора.

Все работает правильно, пока я не нажму кнопку добавления. Начальные поля работают хорошо, но добавленные не работают. Я имею в виду, что шаги 1 и 2 больше не выполняются, когда я нажимаю флажок.

Мой PHP и HTML

<hr><div class="container1">
<button class="add_form_field">Add New Field &nbsp; <span style="font-size:16px; font-weight:bold;">+ </span></button>
<input type = "checkbox" name = "ckautor[]" checked = "ckautor" onclick = "f_autor(this.checked)">Adauga Autor:<br />
<div><select name = "select_aut[]" id = "select_aut" >
<?php
$select_autor = mysqli_query(conectare(), "SELECT nume_autor FROM autor");
while ($row = mysqli_fetch_array($select_autor)){
?><option><?php
echo $row["nume_autor"];
?></option><?php
}
?>
</select></div>
<p>Autor:</br>
<input type = "text" name = "nume_autor[]" id = "nume_autor" size = "40" disabled = "disabled"></p>
</div><hr>

Мой JavaScript

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script>
$(document).ready(function() {
var max_fields      = 10;
var wrapper         = $(".container1");
var add_button      = $(".add_form_field");

var x = 1;
$(add_button).click(function(e){
e.preventDefault();
if(x < max_fields){
x++;
$(wrapper).append('<div><input type = "checkbox" name = "ckautor[]" checked = "ckautor" onclick = "f_autor(this.checked)">Adauga Autor:<br /><div><select name = "select_aut[]"><?php $select_autor = mysqli_query(conectare(), "SELECT nume_autor FROM autor");while ($row = mysqli_fetch_array($select_autor)){ ?> <option> <?php echo $row["nume_autor"]; ?> </option> <?php } ?></select> </div> <input type="text" name="nume_autor[]" size = "33" disabled = "disabled"/><a href="#" class="delete"> Delete </a> </div>'); //add input box
}
else
{
alert('Maximum limit is 10!')
}
});

$(wrapper).on("click",".delete", function(e){
e.preventDefault(); $(this).parent('div').remove(); x--;
})
});
</script>
---------------------------------------------------------------------------------------
function f_autor(ckautor){
if(!ckautor){
document.getElementById('select_aut').disabled = true;
document.getElementById('nume_autor').disabled = false;
}
else{
document.getElementById('select_aut').disabled = false;
document.getElementById('nume_autor').disabled = true;
}
}