Jquery doesnt work on modal Bootstrap

Question

Hello I'm trying to enable/disabled an input depending on select value, all this in a modal, but it doesn't seem to work.

The idea is that if my estado_rx is Cerrado and I select Abierto, the input of Fecha Apertura, and the select for Responsable should enable, otherwise they should be disabled.

Is quite similar when my estado_rx is Abierto or Alicuota and I select Agotado, the input of Fecha Agotado should enable, otherwise it should be disabled.

Here is my code:

<div class="modal fade modal-slide-in-right" aria-hiden="true" role="dialog" tabindex="-1" id="modal-status-{{$rx->id_rx}}">

    {!!Form::model($rx,['method'=>'PUT','route'=>['reactivos.update',$rx->id_rx]])!!}
    {{Form::token()}}

<?php

$usuarios=DB::table('users')->get();

?>

    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title">Cambiar estado de reactivo</h4>
            </div>
            <div class="modal-body">
                <p>¿Desea cambiar el estado del reactivo: <b>{{ $rx->nom_rx }}</b>?</p>

                <div class="form-group">
                    <label for="estado_rx" class="col-md-12" control-label"><b>Estado</b></label>
                    <select name="estado_rx" class="form-control" required id="staterx">
                        @if ($rx->estado_rx=='Cerrado')
                        <option value="Abierto">Abierto</option>
                        <option value="Cerrado" selected>Cerrado</option>
                        @elseif ($rx->estado_rx=='Abierto')
                        <option value="Abierto" selected>Abierto</option>
                        <option value="Agotado">Agotado</option>
                        @elseif ($rx->estado_rx=='Alícuota')
                        <option value="Alícuota" selected>Alícuota</option>
                        <option value="Agotado">Agotado</option>
                        @endif
                    </select>
                </div>

                @if ($rx->estado_rx=='Cerrado')
                <div class="form-group">
                    <label class="form-label" for="fecha_aper"><b>Fecha Apertura</b></label>
                    <input type="text" class="form-control datepicker-only-init" name="fecha_aper" id="f_aper" disabled/>
                </div>

                <div class="form-group">
                    <label class="form-label" for="responsable_rx"><b>Responsable</b></label>
                    <select name="responsable_rx" class="form-control" id="responsable" disabled>
                        <option value="" selected> </option>
                        @foreach ($usuarios as $user)
                            <option value="{{$user->name}}">{{$user->name}}</option>
                        @endforeach
                    </select>
                </div>
                @endif

                @if (($rx->estado_rx=='Abierto')||($rx->estado_rx=='Alícuota'))
                <div class="form-group">
                    <label class="form-label" for="fecha_agotado"><b>Fecha en que se agotó</b></label>
                    <input type="text" class="form-control datepicker-only-init" name="fecha_agotado" id="f_ago"/>
                </div>
                @endif

            </div>
            <div class="modal-footer">
                <div class="form-group">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Cancelar</button>
                    <button type="submit" class="btn btn-success">Aceptar</button>
                </div>

            </div>
        </div>
    </div>

    {{Form::Close()}}


</div>

<script type="text/javascript">
    $('#staterx').change(function() {
    if( $(this).val() == 'Agotado') {
        $('#f_ago').prop( "disabled", false );
    } else {       
        $('#f_ago').prop( "disabled", true );
    }
});
</script>

How can I use Jquery function to do this inside a modal? Thanks