Edit Specific Parts in CSS from JS

When I want to just edit color or text within the CSS from JavaScript I usually use document.element.style.property = "property value";
Example:

document.body.style.backgroundColor = "#34495e";

Code (markup):

I want to just target the heading and heading:hover in the element. Is there any way to do that?

getElementById("demo")

Code (markup):

If my Id is "demo", what would I add to only target the h1 or the h1:hover

Hope this makes sense

 

Hello,

I recommend you to try to use JavaScript library - jQuery.
jQuery greatly simplifies JavaScript programming and it's easy to learn.
https://learn.jquery.com/

jQuery supports most CSS3 selectors. The most basic concept of jQuery is to "select some elements and do something with them."
https://learn.jquery.com/using-jquery-core/selecting-elements/

Hope that will help you.

 

Smart move. Add 384K of minified jQueery crap to a page needing LESS than 100 bytes to do his job. HOW IN HELL IS THAT SIMPLER AND EASIER?

Not only that, but it pisses on every battery operated device out there.

@deathshadow will be the BEST person out there to get the job done RIGHT THE FIRST TIME without any jQueery crap.

 

What am I missing? It's late, so almost anything could slip by me. But, why do you want to use javascript for a simple css job? Rule 1, state you problem as what you want to do, NOT how you want to do it. Rule 2, see rule 1.

Regarding jQuery, dumb, dumb, dumb, dumb for this purpose. It's simply too big for such a small job; like bringing a strip mine dragline to the garden to cut a trench for your potatoes.

gary

//edit: "How" may be part of the problem statement if this is homework. In that case, you're supposed to do this yourself. ~g

 

Do you not have a stylesheet and elements identified with an id attribute so you can target with class swaps?

Do it properly, and all you need to do is:

document.getElementById('someid').className='someclass';

If you have already hack it and screwed it up beyond help. You could access it through cssRules in the stylesheet object, or us the dom methods to give it an event handler for the mouseover, and then use setAttribute() from the DOM.

But all that is stupid an unnecessary if you do you styling and effects using conventional CSS in a stylesheet instead of crapping all over the page with scripting that screwsup the Document Object and makes maintenance a tap dance in a minefield.