Reset style properties

Question

I'm setting properties of the :root pseudo class in this manner:

$(":root")[0].style.setProperty(variable, value);

If I wanted to reset all the properties precedently set, how can I do? Without specifying every variable set, assigning empty values.

Answer 1

Found a way, just reset the style object:

$(':root')[0].style = {}

Answer 2

Umm.. how about you use all:unset. So:

$(":root")[0].style.setProperty("all", "unset");

Demo:

h1 {
   color: red;
   all: unset;
}

<h1>Hello this should not be red nor should have default h1 styles</h1>