Skip to content
No description, website, or topics provided.
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.


jerry is a lightweight JavaScript DOM interaction Library, inspired by JQuery.


  • Traverse and manipulate single or multiple DOM elements
  • Add and remove DOM elements
  • Handle DOM events
  • Make AJAX requests


In order to use jerry, download this library into your project and add jerry.js in a script tag on the head of your root HTML page.

  <script src="./jerry.js" charset="utf-8"></script>

A demo is provided in the demo folder.


$j returns an instance of a DOMNodeCollection. If a string is passed as an argument, $j will return a new DOMNodeCollection containing all of the HTML elements on the page that match the argument passed to it. If the argument is a function, or there are multiple functions, these will be stored in a queue, and executed consecutively once the document has fully loaded.

function $j(selector) {
  let nodeList;
  if (selector instanceof Function) {
    if (document.readyState === 'complete') {
    } else {
  } else if (selector instanceof HTMLElement) {
    return new DOMNodeCollection([selector]);
  } else {
    nodeList = document.querySelectorAll(selector);
    return new DOMNodeCollection(Array.from(nodeList));

Selection with $j

DOM elements are selected based on the type of input passed to $j:

HTML elements

Select all HTML elements of a given type on a page by passing a string as an argument.

Select by Class Name

Select all elements belonging to a particular class by prefixing each string item with '.'.

Select by ID

Select all elements belonging to a particular class by prefixing the string with '#'.

DOM Manipulation

There are numerous methods available to interact with DOM elements once they have been selected:

html(str) empty each(callback) append(element) attr(attributeName, value) addClass(newClass) removeClass(className) parent children find(arg) on(action, callback) off(action, callback) $j.ready(callback) $j.keydown(callback) $j.extend


jerry is able to send AJAX requests, and return a promise upon success/failure.

$j.ajax = options => {
  return new Promise((resolve, reject) => {
    const xhr = new XMLHttpRequest();
    const defaults = {
      contentType: 'application/x-www-form-urlencoded; charset=UTF-8',
      method: "GET",
      url: "",
      dataType: "JSON",
      success: () => {},
      error: () => {},
      data: {},
    options = $j.extend(defaults, options);, options.url);
    xhr.onload = () => {
      if (xhr.status === 200) {
      } else {
You can’t perform that action at this time.