Event Setup: Add a Class to change the style of a DIV

How To
#1

Hey, this plugin is awesome so far! I’m trying to add a class to DIV when the user clicks on a certain DIV. The flow should go as:

  1. User clicks on DIV with .driveChoices__single
  2. DIV with .driveChoices__single gets a new class added .driveChoices__single–selected with it’s styling.

The issue I am facing, is the class is being added in the DOM tree, but the styling is not being applied?

Any ideas? The test link is here

Screen Shot 2022-11-06 at 11.42.09 PM
Screen Shot 2022-11-06 at 11.42.09 PM1548×900 152 KB

#2

Hi :slight_smile:

How do you define the CSS properties? Seems that there is no styling for the class " driveChoices__single–selected". When adding styles for this class in the console, you get the expected result:

Bildschirmfoto 2022-11-07 um 10.11.55
Bildschirmfoto 2022-11-07 um 10.11.551920×1180 89.5 KB

#3

The issue is the styles are not being added despite having the class styled in Bricks. I found out the correct styles are added though when I have the class already loaded on the page. As shown in the video.

Perhaps I should have one of the options pre-selected so the class style in already loaded in the page.

#4

I was also using Events and having problems with adding and removing classes. Seems like there is a bug at work? I posted my findings here: Assorted bugs (Version 0.9.2)

#5

Hmm… I cannot reproduce the issue. The Bricksforge and also the custom Global Classes should load without the need to add them to a specific Bricks element. See also here:

Am I perhaps misunderstanding something?