Show “loading” animation on button click - stackoverflow - W3Schools

If you are using ajax then (making it as simple as possible)

1. Add your loading gif image to html and make it hidden (using style in html itself now, you can add it to separate CSS):

   <img src="path\to\loading\gif" id="img" style="display:none"/ >

2. Show the image when button is clicked and hide it again on success function

   $('#buttonID').click(function(){
     $('#img').show(); //<----here
     $.ajax({
       ....
      success:function(result){
          $('#img').hide();  //<--- hide again
      }
   }

Make sure you hide the image on ajax error callbacks too to make sure the gif hides even if the ajax fails.