Refre sh div, когда текстовое поле возвращает нулевое значение, используя ajax in laravel

Question

Я получаю информацию о клиенте, который выполняет поиск в текстовом поле имени, я получаю результат, но когда я удаляю имя из текстового поля, и текстовое поле становятся пустыми, предыдущий результат остается таким же, как и во всех текстовых полях, моя цель состоит в том, чтобы обновить sh div, когда текстовое поле возвращает нулевое значение. В моем jquery я использую функцию keyup для получения результата, но когда текстовое поле пусто, нам нужно переопределить sh div.

jquery:

$(document).ready(function(){
    $('#name').keyup(function(){ 
        var query = $(this).val();
        if(query != '')
        {
            var _token = $('input[name="_token"]').val();
            $.ajax({
                url:"{{ url('/autocomplete') }}",
                method:"get",
                data:{query:query, _token:_token},
                success:function(data){
                    $('#nameList').fadeIn();  
                    $('#nameList').html(data);
                }
            });
        }
        else
        {
            $("#customer_details").load(" #customer_details");
        }
    });
});

Blade :

<div class="card-block" align="center">
    <h4>Customer Details</h4><hr>
    <form action="/customer" method="post">
        <input type = "hidden" name = "_token" value = "<?php echo csrf_token(); ?>">
        <div id="customer_details">
            <div class="row">
                <div class="col-sm-4">
                    <p class="c-black f-500">Customer Name</p>
                    <div class="form-group">
                        <div class="fg-line">
                            <input type="text" class="form-control" name="name" id="name" placeholder="Enter Customer Name or Mobile Number" autocomplete="off">
                            <div id="nameList">
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-sm-4">
                    <p class="c-black f-500">Customer Mobile Number</p>
                    <div class="form-group">
                        <div class="fg-line">
                            <input type="text" class="form-control" name="customer_mobile" id="customer_mobile" value="">
                        </div>
                    </div>
                </div>                  
                <div class="row">
                    <div class="col-sm-4">
                        <p class="c-black f-500">State</p>
                        <div class="form-group">
                            <div class="fg-line">
                                <!-- <input type="text" class="form-control" name="state" id="state" value=""> -->
                                <select class="form-control" name="state" id="state">
                                    <option readonly>Select State</option>
                                    @foreach($states as $key => $state)
                                    <option value="{{$key}}"> {{$state}}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="col-sm-4">
                        <p class="c-black f-500">District</p>
                        <div class="form-group">
                            <div class="fg-line">
                                <select name="district" class="form-control" id="district">
                                </select>
                            </div>
                        </div>
                    </div>
                </div>
            </div>