7 replies

Adding pseudo-class to elements with JavaScript

Hi, does anyone know of an easy way to add pseudo-class styles to an element created with JavaScript? For example:

const button = document.createElement('button');
button.style.backgroundColor = 'lightblue';
button.style.color = '#333';

// add hover state?

const button = document.createElement('button');
button.style.backgroundColor = 'lightblue';
button.style.color = '#333';

// add hover state?

const button = document.createElement('button');
button.style.backgroundColor = 'lightblue';
button.style.color = '#333';

// add hover state?

const button = document.createElement('button');
button.style.backgroundColor = 'lightblue';
button.style.color = '#333';

// add hover state?

How can I add a hover state following this same approach? I ran into this situation and I didn't know how to make it work, although I will ultimately use React later on. Still just for prototyping quickly I like using vanilla JS.

There seem to be a lot of weird workarounds that I rather not get into.... so if someone knows of an easy way, please share? Thanks!

Adding pseudo-class to elements with JavaScript

Similar Threads

Similar Threads

Similar Threads