Pseudo element content with JQuery

LeBlaireau

I am trying to change the arrow on an :after pseudo element

my css

legend:after {
    content: url('/html/img/arrow-fieldset-up.png');
}

I am trying to change with

$('legend', selected_fieldset).attr('content','url(/html/img/arrow-fieldset-down.png)')
Felix

You cannot select the pseudo element with jQuery. Instead you can add a class to your CSS:

legend.selected:after {
    content: url('/html/img/arrow-fieldset-down.png');
}

then add this class when you want to change the content, for example when you click the legend:

$('legend').click(function() {
    $(this).addClass('selected');
})

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

From Dev

How to remove element after pseudo-content with jQuery

From Dev

disable touch on the pseudo content of an element

From Dev

Unicode in data-content for pseudo element content

From Dev

Use content of an element in attr() of pseudo-element

From Dev

Update CSS of Pseudo Element with jQuery

From Dev

before pseudo-element covering inner content

From Dev

CSS Transition on the 'content' property of :before pseudo element

From Dev

Getting pseudo-element content in Chrome

From Dev

CSS Transition on the 'content' property of :before pseudo element

From Dev

Move content added with pseudo-element:after

From Dev

IE 11 considers pseudo content as part of element content

From Dev

How to dynamically alter the CSS of a pseudo element with JQuery?

From Dev

Toggle a pseudo-element using jQuery

From Dev

JQuery select pseudo-element :after

From Dev

Toggle a pseudo-element using jQuery

From Dev

Modify the css of a pseudo element using JQuery

From Java

What is the ::content/::slotted pseudo-element and how does it work?

From Dev

automate the content value of pseudo element depending which number the child is

From Dev

Change content property of pseudo element within CSS animation

From Dev

How do I style part of the pseudo element content: "..."

From Java

Is there a way to use SVG as content in a pseudo element :before or :after

From Dev

is it possible to animate and remove the pseudo content from a element..?

From Dev

css pseudo-element appearing over top of content

From Dev

Using the :after CSS pseudo-element without inserting content

From Dev

CSS centering content add by pseudo-element after

From Dev

Dynamic styling for pseudo element's content in Vue2.x

From Dev

How to inserted HTML tag from pseudo-element content:

From Dev

Vertically/horizontally centering a pseudo element's generated content

From Dev

Retrieve a pseudo element's content property value using JavaScript

Related Related

  1. 1

    How to remove element after pseudo-content with jQuery

  2. 2

    disable touch on the pseudo content of an element

  3. 3

    Unicode in data-content for pseudo element content

  4. 4

    Use content of an element in attr() of pseudo-element

  5. 5

    Update CSS of Pseudo Element with jQuery

  6. 6

    before pseudo-element covering inner content

  7. 7

    CSS Transition on the 'content' property of :before pseudo element

  8. 8

    Getting pseudo-element content in Chrome

  9. 9

    CSS Transition on the 'content' property of :before pseudo element

  10. 10

    Move content added with pseudo-element:after

  11. 11

    IE 11 considers pseudo content as part of element content

  12. 12

    How to dynamically alter the CSS of a pseudo element with JQuery?

  13. 13

    Toggle a pseudo-element using jQuery

  14. 14

    JQuery select pseudo-element :after

  15. 15

    Toggle a pseudo-element using jQuery

  16. 16

    Modify the css of a pseudo element using JQuery

  17. 17

    What is the ::content/::slotted pseudo-element and how does it work?

  18. 18

    automate the content value of pseudo element depending which number the child is

  19. 19

    Change content property of pseudo element within CSS animation

  20. 20

    How do I style part of the pseudo element content: "..."

  21. 21

    Is there a way to use SVG as content in a pseudo element :before or :after

  22. 22

    is it possible to animate and remove the pseudo content from a element..?

  23. 23

    css pseudo-element appearing over top of content

  24. 24

    Using the :after CSS pseudo-element without inserting content

  25. 25

    CSS centering content add by pseudo-element after

  26. 26

    Dynamic styling for pseudo element's content in Vue2.x

  27. 27

    How to inserted HTML tag from pseudo-element content:

  28. 28

    Vertically/horizontally centering a pseudo element's generated content

  29. 29

    Retrieve a pseudo element's content property value using JavaScript

HotTag

Archive