使用ajax响应更新图像的src

I am trying to update the profile picture of user via ajax. So far I have stored the new image in db, displayed the loading gif, but I am unable to update the image which is being displayed. I am having problem attaching the response variable to src attribute which is again generated using laravel url().

success: function(data){
  $('#displayPhoto').html('<img src="{{url('images/profile/')}}.data[0]" alt="" class="responsive-img" style="height: 132px; width: 132px;">');
 });

You shouldn't mix PHP and JS. A better way to use URL in a controller method and return full URL to JS, for example:

$('#displayPhoto').html('<img src="' + data[0] + '" alt="" class="responsive-img" style="height: 132px; width: 132px;">');

In js if you want to append data, you must use the '+' instead of the diacritic '.' Edit code :

success: function(data){
  $('#displayPhoto').html('<img src="'+data[0]+'" alt="" class="responsive-img" style="height: 132px; width: 132px;">');
 });