How to call ajax each time as a process?

Question

I have a list of data

$data = ['url_1','url_2','url_3',...,'url_n'];

I called AJAX to get the return data , server overload

<script>
@foreach ($data as $key => $item)
  $.ajax({
    url: "/get-data-test-res",
    data: {"url" : "{{ $item }}" },
    type : "get",
  }).done(function(res) {
    $('.{{$key}}').html(res.title);
  });
@endforeach
</script>

Is there a way to Ajax load each element, e.g., loading Ajax url_1 complete will call Ajax url_2, then url_n

$.ajax({
    url: "/admin/get-data-test-res",
    data: {"url" : "url_1" },
    type : "get",
  }).done(function(res) {
    $('.1').html(res.title);
      $.ajax({
        url: "/admin/get-data-test-res",
        data: {"url" : "url_2" },
        type : "get",
      }).done(function(res) {
        $('.2').html(res.title);
        ....
      });
  });

Please help, thanks for reading my post.