AJAX success function not working

Question

I made ajax function for button that if i click it means 'like' and record to database
then the button is gonna change to 'dislike' and if click again it means delete record.

In the record part is working fine but i'm stuck on success function
this is my whole javascript..

    <script type="text/javascript">
  function addLikes(userFRIEND,action) {
  $('.demo-tutor #tutorial-'+userFRIEND+' li').each(function(index) {
    $(this).addClass('selected');
    $('#tutorial-'+userFRIEND+' #rating').val((index+1));
    if(index == $('.demo-tutor #tutorial-'+userFRIEND+' li').index(obj)) {
      return false; 
    }
  });


  $.ajax({
  url: "add_follow.php",
  data:'userFRIEND='+userFRIEND+'&action='+action,
  type: "POST",
    beforeSend: function(){
    $('#tutorial-'+userFRIEND+' .btn-likes').html("<img src='http://www.seedsofpeace.org/gif/loading.gif' />");
  },
  success: function(data){
  var followings = parseInt($('#likes-'+userFRIEND).val());
  switch(action) {
    case "like":
    $('#tutorial-'+userFRIEND+' .btn-likes').html('&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<button type="button" class="btn btn-danger btn-xs unlike" onClick="addLikes('+userFRIEND+',\'unlike\')">&nbsp;&nbsp;&nbsp;Unfollow&nbsp;&nbsp;&nbsp;</button>');
    followings = followings+1;
    break;
    case "unlike":
    $('#tutorial-'+userFRIEND+' .btn-likes').html('&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<button type="button" class="btn btn-danger btn-xs like" onClick="addLikes('+userFRIEND+',\'like\')">&nbsp;&nbsp;&nbsp;Follow&nbsp;&nbsp;&nbsp;</button>')
    followings = followings-1;
    break;
  }
  $('#likes-'+userFRIEND).val(followings);
  if(followings>0) {
    $('#tutorial-'+userFRIEND+' .label-likes').html(followings);
  } else {
    $('#tutorial-'+userFRIEND+' .label-likes').html('0');
  }
  }
  });
}
    </script>

I try to put alert on success function and it's work. so I think the errors must be on

$('#tutorial-'+userFRIEND+' .btn-likes').html("blabla");

#tutorial-'+userFRIEND+' .btn-likes

but to be honestly i don't know how to fix it

and this is the html that relate with javascript
(I'll show via picture for easy looking.)

HTML fig.

thank you so much for every suggestion.

Answer 1

seems you do wrong with the posted data, try do it in this format:

  url: "add_follow.php",
  data: {
    userFRIEND:userFRIEND, 
    action:action
  },
  type: "POST",

then try this selector:

 console.log(userFRIEND) // this really logs "1" ? 
 $('#tutorial-'+userFRIEND+').find('.btn-likes').html("blabla");

Answer 2

Seems like you're using jquery without

$(document).ready(function() {
    // your code
});

Be sure to put you js code at the end of the page and, as mentioned before me, put and object in ajax data property