I have a block with some media query rule applied to it, something like this:

<style>
@media (prefers-color-scheme: dark) {
  div{ background:  black; color: white; }
}

@media (prefers-color-scheme: light) {
  div { background: white; color: black; }
}
</style>
<div>
some content
</div>

And I need to toggle the media query from JS, somehow like that:

document.querySelector('div').media['prefers-color-scheme'] = 'light'; // or 'dark'

Is there such a DOM API? Is this possible?

UPD: I don't want to change the rule, I want to "emulate" changing external conditions.

Thank you.