html - Changing CSS with JavaScript -

html - Changing CSS with JavaScript -

when using javascript alter css javascript create new inline-css takes presidents? i've felt inline css trashy , wondering if there's improve way?

for illustration if have

<div id="author">author's name</div> coloured greenish reference external css , want alter reddish must use

document.getelementbyid('author').style.color='#ff0000'

must changes appearance done using inline-stying?

no, you're not modifiying css. you're setting style properties. mark of element decided 3 things: css, style , inline properties width="100". order in applied can little fuzzy.

style overrule css though, unless you're using !important.

a more mutual way alter mark of elements add together , remove classes. allows maintain style definitions in css file , makes code considerably less complex.

you do:

document.getelementbyid('author').classname = "selected";

to add together class , have display in different mark up.

if you're using jquery can utilize addclass , removeclass. under hood modifies classname property. it's easy plenty write own implementation, need string juggling.

javascript html css getelementbyid