9

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

rcs20
  • 595
  • 9
  • 27
  • I'm not sure you can. See this link: http://stackoverflow.com/questions/2651739/how-to-access-css-generated-content-with-javascript That said, you are using jQuery. If you're already using jQuery, why bother with the CSS :after? Just insert your content using jQuery to begin with. – DA. Feb 14 '12 at 17:06
  • Because the pseudo code is already there and I need to change the background color and other properties. – rcs20 Feb 14 '12 at 17:07
  • That's my point. If you use jQuery to insert the content, you can change all the styles before you even insert it. – DA. Feb 14 '12 at 17:08

1 Answers1

16

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

Didier Ghys
  • 30,396
  • 9
  • 75
  • 81