refreshing a div using ajax, my div didn't refresh

Question

after deleting some data using ajax, i want to refresh my div. I am using Laravel 5.4 . I am a beginner in laravel. Please help me about this.

This is my code in refreshing a div :

var url = window.location.href;
function RefreshDiv() {
    $(".uploaded-images").fadeOut();
    $(".uploaded-images").load(url+" .uploaded-images", function() {
      $(".uploaded-images").fadeIn();
    });
}

When i execute the RefreshDiv function , it only makes my div empty, but when i press f5 to refresh my page, it successfully deleted my data. My only problem is my RefreshDiv where i wan't it to refresh my div but it gives me empty div.

Here is my delete function that executes well:

function deleteImage(product_img_id) {
  $.ajax({
    url: "{{ url('admin/del-img') }}/" +product_img_id,
    type: "GET",
    dataType: "JSON",
    success: function(data) {
      RefreshDiv();
    }
  });
}

here is my div that i want to refresh:

<div class="row" style="margin-top: 20px;">
          <h5>Uploaded Images</h5>
          <div class="uploaded-images">
          </div>
</div>

inside of my uploaded-images div , is a delegate function from my other ajax.

Here is my delegate function :

function getProductDetails(product_id) {
    $( ".uploaded-images" ).empty();
    $.ajax({         
        url: "{{ url('admin/get-product') }}/" +product_id,        
        type: "GET",
        dataType: "JSON",
        success: function(data) {
for(var i=1;i<data.product_images.length;i++) {
                 $(".uploaded-images").append('<div class="img-wrap">'+'<span class="close">&times;</span>'+'<img src="'+"{{ asset('image_files') }}/"+data.product_images[i].product_image+'" data-id="'+data.product_images[i].product_img_id+'" style="max-height:50px; max-width:90px;">'+'</div>');
            };   
        }
    }); 
}

Answer 1

Why you want to refresh the div...If you're removing the image why not just remove the element on success from DOM?

Try this:

function RefreshDiv(product_img_id) {
   $("img[data-id="+product_img_id+"]").closest('.img-wrap').remove();
}