1. The file is not there or does not exist
People tend to become upset and/or frustrated (Including me) when something simple doesn’t work, such as jQuery not working. Before you do anything, navigate to your jQuery file and check that it is exactly where it should be.
Also make sure that you have the correct html file open – I have actually tried to load files using the incorrect html, so the path would have been correct if I had the correct html file open. Don’t ever be too proud to check the absolute basics.
2. Incorrect File Path
3. Script load order
Help! jQuery not working, however it is loading perfectly!!!
If you were to load a library plugin (extra script file) before the library itself has been loaded, the plugin would be seen as bunch of mumbo-jumbo by the browser. This snippet of code means absolute nothing before the library has been loaded.
4. Plugin not working
Plugins malfunction sometimes, for whatever reason; And people sometimes tend to think that jQuery is not working, which isn’t always the case. When it gets this far I think to myself, “Lets get out the big guns”.
Note: Step 1 and 2 can also be applied to CSS problems.
Even though I have tried step 1, step 2 and step 3, I do ANOTHER test to make 100% sure that it is loading properly. 99.999% of the time this is the final test.
This adds a 3px red border to every single div on the page.
If this works, which it really should, the library is loading correctly. You then know that there is something wrong with the plugin(s) and that it is time for more troubleshooting. If you have more than one plugin, try switching the plugin order (This has worked for me on a few occasions), if it is still unsuccessful then remove each plugin and test until something works. Once you find the problem plugin, download it’s latest available version and see if it works.
If the 3px red border does not show up, then it’s time to jump to the next step.
Make sure you are using a modern browser, and not IE 5.5 or something old and outdated.
- I have started loading jquery through Google at all times:
The only downside to doing this that I can think of is if you are working offline (Obviously it won’t load) or if Google goes down for whatever reason.
- Step 1, 2 and 3 can be applied to CSS files too. The Step 3 load order could refer to the IE specific stylesheets loading before the main one.
- jQuery not working? Then follow the 6 steps again 🙂
- Feel free to comment and ask for help if any is needed.