Satisfy is a development-only jQuery plugin* that you can use to quickly generate HTML for testing/debugging. The idea is that you provide a CSS selector and then the plugin will “satisfy” it by generating an HTML structure in accordance with that selector.

* – UPDATE: This is no longer just a jQuery plugin – as of version 0.2 Satisfy has no dependencies. See the comments for more info.

For example:

jQuery('div a').satisfy();

… would return the following HTML structure:


A more snazzy example:

jQuery('ul li:5 span[innerHTML="link"]').satisfy();

… which would return the following:


(Note: It ignores combinators (+|~|>) and pseudo-classes (:pseudo). It adds support for numerical pseudo-classes (e.g. “:5”) which you can use to specify how many of a particular element you want.)

More information and source available at Github – “satisfy” @ GitHub

Thanks for reading! Please share your thoughts with me on Twitter. Have a great day!