JSFiddle - React, Tailwind, and code Playground

HTML

<body>
    <p>a simply paragraph.</p>
</body>

CSS

p {
    display: block;
    background-color: green;
}

JavaScript

$.extend(
$.expr.filters, {
    block: function (elem) {
        return $(elem).css('display') === 'block';
    },

    //filter greenbg does not work, why?
    greenbg: function (elem) {
        return $(elem).css('background-color') === 'green';
    }
});

$(function () {
    $('p:block').html('yes, it is a block.');

    // the following line does not work, why?
    $('p:greenbg').append(' it is  green.');
});