Input blur not working

Question

I am trying to add a .success class to an input field whenever I click out of the input field. However, when I click off of the input the .required class is still showing even though I have removed the class. What am I doing wrong?

$('#legal_name').focus(function () {
    $('legal_name').removeClass('whiteBorder');
    $('#legal_name').addClass('required');
});
$('#legal_name').blur(function () {
    $('legal_name').removeClass('required');
    $('legal_name').addClass('success');
});

Answer 1

Typo

$('#legal_name')
   ^ missing id-selector

# id-selector

---

or better use

$('#legal_name').focus(function () {
    $(this).removeClass('whiteBorder').addClass('required');
}).blur(function () {
    $(this).removeClass('required').addClass('success');
});

this-keyword