Create CSS using js?

Issue

So In javascript you can do things like

document.querySelector('html').style.filter = 'invert(100%)'

Which Inverts colors on the entire webpage but is there anyway to use

document.querySelector('html').style.pointer = 'something'

or a way to add a css rule or something to the document?

example you have an element like this

hello

then js gives an class hello

then js adds a css rule?

.why {}

Solution

You could write to the document using document.write

document.write(`
<style>
  #text {
    color: red;
  }
</style>`)

<h1 id='text'>Hello</h1>

Or, you can also create an element and append it to the document

let style = document.createElement('style')
style.innerHTML = `
.text {
  color: red;
}
`

document.body.appendChild(style)

<h1 class='text'>Hello</h1>

Answered By - PyxlDavon