toggleClass

toggleClass(elm, classNames[, force])

Toggles one or multiple class names to a DOM Element.

Parameters

• elm (HTMLElement) - DOM Element to toggle class names from
• classNames (String|Array<String>) - Class names to remove
• force (Boolean) - [optional] Force removal (false) or adding (true)
• returns (HTMLElement) - Returns element given in elm

Usage

toggling

import toggleClass from 'vanillajs-browser-helpers/toggleClass';

// Toggle a class
toggleClass(element, 'my-class');

// Toggle multiple classes (as space separated string)
toggleClass(element, 'my-class my-second-class my-nth-class');

// Toggle multiple classes (as array)
toggleClass(element, ['my-class', 'my-second-class', 'my-nth-class']);

Force removal

import toggleClass from 'vanillajs-browser-helpers/toggleClass';

// Remove a class
toggleClass(element, 'my-class', false);

// Remove multiple classes (as space separated string)
toggleClass(element, 'my-class my-second-class my-nth-class', false);

// Remove multiple classes (as array)
toggleClass(element, ['my-class', 'my-second-class', 'my-nth-class'], false);

Force adding

import toggleClass from 'vanillajs-browser-helpers/toggleClass';

// Add a class
toggleClass(element, 'my-class', true);

// Add multiple classes (as space separated string)
toggleClass(element, 'my-class my-second-class my-nth-class', true);

// Add multiple classes (as array)
toggleClass(element, ['my-class', 'my-second-class', 'my-nth-class'], true);