# jQuery doesn't work on some websites only in firefox

**URL:** <https://discourse.mozilla.org/t/jquery-doesnt-work-on-some-websites-only-in-firefox/36467>\
**Category:** Development\
**Created:** [March 3, 2019, 7:21pm UTC](https://discourse.mozilla.org/t/jquery-doesnt-work-on-some-websites-only-in-firefox/36467 "2019-03-03T19:21:45Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![rishabhmw](https://avatars.discourse-cdn.com/v4/letter/r/f17d59/32.png) [@rishabhmw](https://discourse.mozilla.org/u/rishabhmw)\
**Post date:** [March 3, 2019, 7:21pm UTC](https://discourse.mozilla.org/t/jquery-doesnt-work-on-some-websites-only-in-firefox/36467/1 "2019-03-03T19:21:45Z")

</div>

Hi,  
This is my firefox addon: [Sauron - Dark mode for all websites](https://addons.mozilla.org/en-US/firefox/addon/sauron-dark-mode/)  
And here is all the code available: [https://github.com/rishabhmw/sauron](https://github.com/rishabhmw/sauron)

It works as expected in chrome but in firefox the jquery in content scripts doesn’t work for some websites such as facebook, quora, and nytimes. I either get `jQuery.Deferred exception: $ is not defined mainReady@moz-extension://39071a01-0540-46e3-b16e-96bd576ca827/content.js:81:5 @moz-extension://39071a01-0540-46e3-b16e-96bd576ca827/content.js:139:13 l@moz-extension://39071a01-0540-46e3-b16e-96bd576ca827/jquery-3.3.1.min.js:2:29373 Deferred/then/a/</c<@moz-extension://39071a01-0540-46e3-b16e-96bd576ca827/jquery-3.3.1.min.js:2:29677 undefined` or no error at all (very rarely) in the console.  
If I try to manipulate DOM with just javascript it works but not with jQuery. Also If the page is already loaded when the extension is disabled and then if the extension is enabled after the page has loaded the DOM changes magically.  
Please help,  
Rishabh

---

<div class="post-metadata">

**Author:** ![rishabhmw](https://avatars.discourse-cdn.com/v4/letter/r/f17d59/32.png) [@rishabhmw](https://discourse.mozilla.org/u/rishabhmw)\
**Post date:** [March 5, 2019, 4:07pm UTC](https://discourse.mozilla.org/t/jquery-doesnt-work-on-some-websites-only-in-firefox/36467/2 "2019-03-05T16:07:24Z")

</div>

The problem seemed to stem from conflicting instances jQuery or conflicting Jquery scripts being loaded. Since all scripts in the extension itself work in harmony the problem must be with firefox. It seems that firefox doesn’t define different scopes for addon scripts and webpage scripts. Anyway little `noConflict()` magic was all that was needed.

---

<div class="post-metadata">

**Author:** ![freaktechnik](https://sea1.discourse-cdn.com/flex001/user_avatar/discourse.mozilla.org/freaktechnik/32/37766_2.png) [@freaktechnik](https://discourse.mozilla.org/u/freaktechnik)\
**Post date:** [March 5, 2019, 6:05pm UTC](https://discourse.mozilla.org/t/jquery-doesnt-work-on-some-websites-only-in-firefox/36467/3 "2019-03-05T18:05:46Z")

</div>

> [@rishabhmw](#):
>
> It seems that firefox doesn’t define different scopes for addon scripts and webpage scripts

It does. However that doesn’t necessarily fix all the issues that jQuery could have with conflicts, since you are still trying to access the same DOM tree.

---

<div class="post-metadata">

**Author:** ![rishabhmw](https://avatars.discourse-cdn.com/v4/letter/r/f17d59/32.png) [@rishabhmw](https://discourse.mozilla.org/u/rishabhmw)\
**Post date:** [March 5, 2019, 6:57pm UTC](https://discourse.mozilla.org/t/jquery-doesnt-work-on-some-websites-only-in-firefox/36467/4 "2019-03-05T18:57:52Z")

</div>

> It does. However that doesn’t necessarily fix all the issues that jQuery could have with conflicts, since you are still trying to access the same DOM tree.

I see, but the error was `$: is not defined` which means that `$` was redefined (?) thus another script was running in the same scope as the content script? Even though we are interacting with the same DOM tree shouldn’t references not conflict on firefox if scopes are well defined and different just as they don’t on chrome. Let me know what you think about this matter.
