How to modify the selector * of css through javascript or jquery

First of all you should select the elements of DOM. Then we can do anything what we want by using javascript as follows.

getElementsByTagName("*") will return all elements from DOM.

var allElements = document.getElementsByTagName("*");
for (var i = 0, len = allElements.length; i < len; i++) {
    var element = allElements[i];
    // Change any style you want 
    // Ex- element.style.border = ...
}

Ref : https://www.w3schools.com/jsref/met_document_getelementsbytagname.asp

Just the same stuff your selector would be *...

So do $("*").css({"font-family": "Arial"}); if using jQuery...

But pure JavaScript, you can do:

document.querySelectorAll("*").forEach(el => el.style.fontFamily = "Arial");

You can have access to your style sheets fom JS and change them directly (not by filter/change any html nodes) more info here.

let rules=document.styleSheets[0].cssRules;

let rule= [...rules].find(r=> r.selectorText=="*" );

rule.style.fontFamily="cursive";

* {
margin: 0px;
padding: 0px;
list-style: none;
text-decoration: none;
font-family: 'Roboto', sans-serif;
}

Example test

<div style="font-family: 'Roboto'">No font change</div>

You could do the following in pure Javascript:

 var everything = document.querySelectorAll("*");

 for(var i=0; i < everything.length; i++) {
     everything[i].style.fontFamily = "Arial";
     //add your CSS styles here
 }

This will loop through every element in the DOM and add the CSS.

Or if you are using Jquery, there is way easier method to do it. See below

  $("*").css("font-family","Arial");

or just simply style the body

$("body").css("font-family","Arial");

Try this

$("*").css({"font-family": "your-font"});