jquery modifies CSS pseudo-element properties method _jquery

CSS pseudo elements (pseudo elements) are not DOM elements, so you cannot select them directly.

Suppose you have the following HTML code:

<div class= "Techbrood" id= "Td_pseudo" >techbrood introduction</div>

and CSS code:

. techbrood:before {
width:0
}

Now you want to dynamically set the Techbrood:before width property to 100% in the click event of an element.

There are two methods, one is to add a new style:

$ (' head '). Append ("<style>.techbrood::before{width:100%}</style>");

(Note that this method will affect all elements of class Techbrood)

Another method is to add a new class to the element and to change the properties of the pseudo element by setting the properties of the new class:

. techbrood.change:before{
width:100%;
}

jquery Code:

$ (' #td_pseudo '). addclass ("Change");