JQuery - Javascript - .hasData() not working for me

I am trying to check if an object with class sourceFocus has data in it. However when I check it, it does not have data when it should. What am I doing wrong here?

$('.source').click(function() {
    $('.source').removeClass('sourceFocus'); 
    $(this).addClass('sourceFocus'); 
    $(this).data('source_selected', true);
    console.log($.hasData(this));
    console.log(this);
});

$('.target').click(function() {

    $('.target').removeClass('targetFocus'); 
    $(this).addClass('targetFocus'); 

    $(this).data('target_used', true);
    //$('.sourceFocus').data('source_used', true);

    console.log($.hasData('.sourceFocus'));

    if($.hasData('.source开发者_运维知识库Focus')){
        console.log("has data worked");
        check_for_duplicates();
}

---

I don't think the .hasData() method accepts selectors in your case .sourceFocus, try selecting .sourcefocus as an element and then passing that to the .hasData() function.

try something like...

console.log($.hasData($('.sourceFocus:first')));

---

$.hasData() checks against a DOM Element you have to get it out of the jQuery object, either using array notation or the .get() method (not to be confused with the $.get() ajax method)

console.log($.hasData($('.sourceFocus')[0]));

---

If you trying to read the HTML between the tags for which you are using .sourceFocus class then do this in your if statement:

$.hasData($('.sourceFocus').html())