Manipulate Html from Firefox Extension

Question

I am creating a Firefox extension that is somewhat similar to Firebug. There is a panel (or vbox) at the bottom of the browser that allows users to specify colors to certain Html elements. When they click the OK button, I would like these colors to get updated on the current web page.

I have my JavaScript working when I click the button (i am just throwing an alert), however when I change that JavaScript to change the css or styles of an element (by either using document.getElementById or jquery), nothing changes.

Is there something with Firefox extensions that I am missing? Any help is appreciated.

Let me know if you have any questions. Thanks

Answer 1

https://developer.mozilla.org/en/Extension_Frequently_Asked_Questions#Accessing_the_document_of_a_webpage_doesn%27t_work

You want content.document.getElementById() and similarly for every other construct you use.