CSS pseudo-code is not recognised by jQuery

Question

my CSS pseudo-code is not recognised by jQuery: here's my code

css:

h1 {
    background: red;
    width: 100px;
    display: inline-block;
}

h1:after {
    content:" | ";
    background:blue;
    display: inline-block;
}

then in jQuery i do:

console.log($('h1').css('backgroundColor'));

is shows:

rgb(255, 0, 0)

but when i do:

console.log($('h1:after').css('backgroundColor'));

is shows:

undefined

Answer 1

You cannot select css pseudo-elements because they don't actually exist in the DOM