change CSS where font-weight:800

Question

I was wondering if there was a way to change CSS on mass where "font-weight: 800" and replace it with 700.

I have a work website that i go to and they've changed all their font-weight from 'bold' to 800 and it makes it look ugly. Was hoping to use Tampermonkey to return it to normal with jquery or javascript.

There are lots of classes and IDs where it has been changed, looks like someone went through the .css file and went find 'bold' replaceWith '800'

Answer 1

You can target the tag whose font-weight has been changed to 800 and then override that using font-weight: bold !important . For example, if the p tag's font-weight has been changed to 800 like this:

p {
     font-weight: 800;
}

You can override it by placing this at the bottom of your stylesheet:

p {
     font-weight: bold !important;
}

You can do the same for the heading tags etc.

Another solution would be to open your stylesheet inside a code editor and simply find and replace all the instances of font-weight: 800px with font-weight: bold .

Answer 2

You can do it with this, you will need to use on page load or something rather than the button click like in the fiddle demo but other than that you shouldnt have any problems.

EDIT edited the code after it was brought to my attention i messed up

$("#btn").on("click", function(){
    $("*").each(function(){
        var fontWeight = $(this).css("font-weight");       
        if(fontWeight == "800"){
            $(this).css("font-weight", "100");
        }
    });   
});

to make this work for your needs just change the 100 to 700 i have it at that to show the change.

Here is the updated demo JSFIDDLE