Существует таблица на bootstrap...
<table class="table table-hover">
<thead>
<tr>
<th scope="col">№</th>
<th scope="col">Фімилія</th>
<th scope="col" colspan="2">Імя</th>
</tr>
</thead>
<tbody class="table-teachers">
<tr>
<th scope="row">1</th>
<th>Петров</th>
<th>Иван</th>
<th>
<button class="btn btn-danger row-delete" title="видалити">
<i class="fa fa-times" aria-hidden="true"></i>
</button>
</th>
<tr>
</tbody>
</table>
Далее есть jquery код который удаляет и добавляет строки в таблице...
Удаляет:
$('.row-delete').click(function(){
$(this).parent().parent().remove();
});
Добавляет:
$('.row-add').click(function(){
var table_row = '<tr>
<th scope="row">0</th>
<td><input class="form-control" type="text" name="" value=""></td>
<td><input class="form-control" type="text" name="" value=""></td>
<td>
<button class="btn btn-danger row-delete" title="видалити">
<i class="fa fa-times" aria-hidden="true"></i>
</button>
</td>
</tr>';
$('.table-teachers').append(table_row);
});
Проблема состоит в том что те строки которые добавлены через jquery не удаляются. А те которые подгрузились при старте документа - удаляются.
Пробовал также
$(document).ready(function(){
});
думая что может из-за этого не хочет удалять добавленые строки, но нет.