This article has a collection of tools for the fast jQuery Development. I am using firefox browser for the development, So the tools are mentioned considering firefox browser.
jQuery Selector:
There are some online tools helps to create complex selectors:
it is good online tool for beginner and helps to create complex selectors against the sample DOM they provide.
In this tool, we can use our content and experiment with the different selectors.
Firebug:
It is breath of designing tasks. You can edit, debug, and monitor CSS, HTML, and JavaScript live in any web page.
FireQuery:
it is a Firefox extension integrated with Firebug• jQuery expressions are intelligently presented in Firebug Console and DOM inspector
• attached jQuery data are first class citizens
• elements in jQuery collections are highlighted on hover
• jQuerify: enables you to inject jQuery into any web page
• jQuery Lint: enables you to automatically inject jQuery Lint into the page as it is loaded (great for ad-hoc code validation)
SelectorGadget:
This bookmarklet allows you to interactively select elements from the DOM to obtain the selector you want. You start by selecting one or more of the items you are interested in and then you progressively select or unselect other items to obtain the selector right for your needs.
FireFinder:
It is similar to SelectorGadget and an add-on to Firebug, to help find HTML elements matching chosen CSS selector(s) or XPath expression. You can also auto-select elements when hovering or via the context menu.
jsFiddle:
It is an online editor for snippets build from HTML, CSS and JavaScript. It supports many frameworks. You can select jQuery framework and start jQuery coding.The code can then be shared with others, embedded on a blog, etc. Using this approach, JavaScript developers can very easily isolate bugs.
The alternate is jsBin.
If you are using any other tool, Share it in below comment box.
Hope, It helps.