Change property of existing UI elements in Javascript

For Example, we want to change the color of mana bar to gold.

First you need to locate the name of element in Panorama debugger (press F6 to open it). Though a little digging, we know the name of element we want to change is ManaProgress_Left. Then you need to find the handle of this element. It's:

hPanel = $.GetContextPanel().GetParent().GetParent().GetParent().FindChildTraverse("ManaProgress_Left")

We want to change the background-color property of it. This can be achieved by adding sub-properties to style property of the panel handle. If the css property you want to change is a single word, like width or visibility, then just define it with a string:

hAnotherPanel.style.width = '50px'
hAnotherPanel.style.visibility = 'collapse'

If the css property you want to change has two words in it, you should capitalize the initial of the second word:

hPanel.style.backgroundColor = 'gold'