jQuery onclick Add/Remove class of child element

jQuery onclick Add/Remove class of child element

Here is the HTML:
<a id="docLocked" title="Unlock this document" style="text-decoration:
none; cursor: pointer;"><span class="iconfa-lock"></span></a>
When the 'icon' is clicked I need it to remove the class of the span
element and then add another class.
Here is what I have but it is not working:
jQuery('#docLocked').click(function () {
jQuery(this).closest('span').removeClass('iconfa-lock');
jQuery(this).closest('span').addClass('iconfa-unlock');
});
What am I doing wrong here?