Estoy intentando realizar un select dinámico, con este código funciona perfecto, pero solo con dos select, si quiero añadir uno nuevo dependiente del segundo que se lleno al elegir opciones del primero ya no funciona, alguien me puede colaborar como lo hago, es como si no cargara los datos para enviar por ajax del segundo select.
<div class="col-md-4 mb-4 md-form">
<label for="tipopqr">Tipo PQR</label>
<select class="form-control" name="tipopqr" id="lista1" onkeypress="return tabular(event,this)" required>
<option value="">Seleccione</option>
<?php while ($filat = mysqli_fetch_array($tipopqr)) : ?>
<option value="<?= $filat['pqr_tip_id']; ?>"> <?= utf8_encode($filat['pqr_tip_nom']); ?></option>
<?php endwhile ?>
</select>
</div>
<div class="col-md-4 mb-4 md-form" id="select2lista">
<script type="text/javascript">
$(document).ready(function(){
recargarLista();
$('#lista1').change(function(){
recargarLista();
});
})
</script>
<script type="text/javascript">
function recargarLista(){
$.ajax({
type:"POST",
url:"funcionespqr/select_subtipo.php",
data:"tipo=" + $('#lista1').val(),
success:function(r){
$('#select2lista').html(r);
}
});
}
</script>