jQuery and pseudo-elements
You can't. Content created by :after
or :before
is not part of the DOM and therefore cannot be selected or modified.
If you have a look at this example fiddle and inspect the DOM in Firebug or similar you will see that the pseudo-element is not present in the DOM tree.
A potential solution would be to apply a class to the element you want to change, and to style that class appropriately in CSS:
$("div").addClass("newClass");
See this fiddle for an example.
add CSS:
p.special:before {
content: "bar";
position: absolute;
top : 10px;
}
assuming the style sheet where the code above was put is the first one on the page, use this to change it:
document.styleSheets[0].addRule('p.special:before','top: 15px;');