JQuery modify an element on document.on('blur') -

JQuery modify an element on document.on('blur') -

here general version of code trying accomplish (the code incomplete, give general idea):

$(document).on('blur', '#idoftextbox', function(event) { function savedata(uri, stringval, success, failure) { $.ajax({ //initialize json object here }); } savedata("/myurl", "mystring", successfunction, failurefunction); function successfunction(response) { var successstring = 'valid'; $('#successmsgtextarea').text(successstring); $('#successmsgtextarea').removeattr('class', 'errormsg'); $('#successmsgtextarea').attr('class', 'successmsg'); } function failurefunction(response) { var successstring = 'invalid'; $('#successmsgtextarea').text(successstring); $('#successmsgtextarea').removeattr('class', 'successmsg'); $('#successmsgtextarea').attr('class', 'errormsg'); } }); //end of blur event

basically, have 2 classes, 1 has reddish x image, other has checkmark image. when user enters value, check if value valid checking if in database. if valid, first remove previous class styling (in case switches invalid valid). display 'valid' , have checkmark (by assigning successmsg class), , if wrong, display 'invalid' , have x besides message (by assigning errormsg class). however, when test out, error text displayed, class never gets updated. did incorrect?

jquery