JSFiddle - React, Tailwind, and code Playground

JavaScript

var div = $('<div />'),
    xmldoc = (new DOMParser()).parseFromString('<rootnode><anode>text content</anode></rootnode>', 'text/xml'),
    aNode = $(xmldoc).find('anode');


jQuery.extend(jQuery.expr[':'], {
    foo: function (el) {
        //always passes the check, unless .undefinedprop is actually defined and is falsy
        return el.undefinedprop;
    },
    bar: function (el) {
        //For HTML elements (belonging to a window.document element) this works right
        //even if .id was never set. This is because in this context, el.id is empty 
        //string
        //For nodes belonging to other documents (XML docs), this always passes,
        //unless .id is actually defined and is falsy
        return el.id;
    },
    baz: function (el) {
        //Always fails the check because a fasly value other than undefined is returned
        return '';
    }
});

console.log(div.is(':foo'));//logs true, but should be false
console.log(div.is(':bar'));//logs false
console.log(div.is(':baz'));//logs false

console.log(aNode.is(':foo'));//logs true, but should be false
console.log(aNode.is(':bar'));//logs true, but should be false
console.log(aNode.is(':baz'));//logs false