Plain JavaScript - Functions and Helpers
Vanilla JS utilities for writing powerful web applications without jQuery.
Selecting
Select elements by class name
getElementsByClassName - a fast way of selecting DOM elements by class name in modern browsers. Does not work in IE 8 and below.
jQuery: $('.foo')
Select elements by tag name
getElementsByTagName - a fast and cross browser safe way for selecting DOM elements by tag name, e.g. "div", "a", "span", etc.
jQuery: $('div')
Select an element by ID
getElementById - a fast and cross browser safe way for selecting DOM elements.
jQuery: $('#foo')
Traversing
Get siblings of an element
Get the next, previous or all siblings of an element or retrieve siblings that match a given selector.
jQuery: $.siblings(), $.next(), $.nextAll(), $.prev, $.prevAll()
Get closest element by selector
Get the first element that matches the selector by testing the element itself and traversing up through its ancestors in the DOM tree.
jQuery: $.closest()
Manipulation
Replace a DOM element
Remove an element from the DOM tree and insert a new one in its place.
jQuery: $.replaceAll(), $.replaceWith()
Unwrap a DOM element
Remove the parents of an element from the DOM, leaving the element's content in place.
jQuery: $.unwrap()
Append or prepend to an element
Insert a new element or an HTML structure to the end or the beginning of another element's content.
jQuery: $.append(), $.appendTo(), $.prepend(), $.prependTo()