Ripetere Campi disabilitando input in riferimento ad un valore della select

[Lucas1]

Buongiorno
Sto creato di creare un form dove aggiungo all'occorrenza, una select e due campi data, dove se il valore della select è “rcompensativo” il primo campo data deve essere disattivato, riesco a farlo solo per il prima riga, quando vado ad aggiungere una seconda riga viene aggiunta ma non fa più il controllo, come posso fare?

Grazie

<tr>
<td colspan='3'><input type='button' value='Aggiungi Recupero' id='ripeti_in' class="btn btn-outline-success"></td>
</tr>
</tfoot>
</table>
<script type="text/javascript">
$(document).ready(function(){
$("#ripeti_in").click(function(){
var rip="<tr><td><select id='sel_riposo1' name='rr[]' class='form-control' required><option></option><option value='rriposo'>Recupero Riposo</option><option value='rfestivo'>Recupero Festivo</option><option value='rcompensativo'>Riposo Compensativo</option></select></td> <td><input id='in_data1' type='date' name='rdel[]' class='form-control'></td> <td><input id='out_data' type='date' name='rfruire[]' class='form-control' required></td> <td><button type='button' class='rmv btn btn-outline-danger'><svg class='bi' width='25' height='25' fill='currentColor'><use xlink:href='../domande/bootstrap/icons/bootstrap-icons.svg#trash3'/></svg></button></td> </tr>";
$(function() {
$('#sel_riposo1').on('change', function() {
$('#in_data1').prop('disabled', this.value == 'rcompensativo');
})
.change();
});
$("#tbl tbody").append(rip);
});
$("body").on("click",".rmv", function(){
$(this).closest("tr").remove();
});
});
</script>