JQuery Ajax Type error in success callback

JQuery Ajax Type error in success callback

I create a button that when clickes do something with Ajax in server and
when come back from server color of the button and its text will change
(something like +1 add friend in facebook) here is my code in .js:
$(".blue").on("click", function(){
var firstName = $(this).prev().prev().text();
var lastName = $(this).prev().text();
$(this).text("Add Friend...");
var data={
firstName: firstName,
lastName: lastName
};
$.ajax({
url: '/ajax/friendRequest',
data: data,
dataType: 'json',
success:function(){
alert(123);
$(this).removeClass("glass blue");
$(this).addClass("greenStatic");
$(this).text("Request sent");
}
});
});
every thing is OK and request will successfully change the database but
when it comeback to the success callback I only see the alert(123); on the
browser and 3 below lines don't run and my chrome developer tools throw
exception of typeError I search SO and change $ sign to jQuery but still I
have same problem