جدا سازی کدهای javascript از html

سلام نمدونم چطور قسمت های جاوا اسکریپتمو جدا کنم از html مثلا اینوبگید چطور ذخیره کنم

 $('#city_id').change(function () {
            var city = $(this).find('option:selected').text();
        })

        $('#pr').change(function () {
            $("#myModal").modal('show');
            var id = $(this).find('option:selected').val();
            $.ajax({
                method:'post',
                url:'{{route('ajax')}}',
                data:{"_token":"{{csrf_token()}}",id:id},
                success:function(msg) {
                    $("#myModal").modal('hide');
                    $('#city_id').html(msg);

                }
            })
        });

من اومدم یک فایل به اسم city.js درست کردم دقیقا همونو داخلش ریختم و جایی که لازم بوده به این صورت نوشتم

<script src="/assets/vendors/js/ui/city.js" type="text/javascript"></script>
اما کار نمیکنه