jQuery .toArray() Method

What Is .toArray()?

.toArray() returns a native JavaScript Array of every DOM element in the jQuery set (since jQuery 1.4). It takes no arguments. The array holds the same live nodes — not jQuery wrappers and not clones.

$(selector).toArray()  → Array of DOM elements

jQuery set  →  [el0, el1, el2, …]
               native Array (document order)

then use: reverse(), map(), filter(), for…of
.get() with no args ≈ same idea
.empty selection → []

How to Use .toArray()

Select elements, convert, then use Array APIs.

1. Build a jQuery set: $("li"), $(".item"), etc.
2. Call .toArray() with no arguments.
3. Use Array methods on the result (reverse, map, …).
4. Wrap a node again with $(node) if you need jQuery methods.

Pseudocode

toArray():
    result = new Array
    for each element in this jQuery set (document order):
        result.push(element)   // same node reference
    return result

// empty set → []

Cheat Sheet

Keep these facts handy when bridging jQuery and Array APIs.

Live Preview

Convert a small jQuery set of list items and try Array methods on the result.

length → 3
tags → LI, LI, LI
Array.isArray → true

/* native Array of DOM elements */

jQuery Examples

Short, copy-ready snippets. Open DevTools Console, or use Try It Yourself for a live editor.

var items = $("li").toArray();

console.log(items.length);           // 3
console.log(Array.isArray(items));   // true
console.log(items[0].tagName);       // LI

3
true
LI

var divs = $("div.demo").toArray().reverse();
var texts = [];

for (var i = 0; i < divs.length; i++) {
  texts.push(divs[i].textContent);
}

console.log(texts.join(" "));  // Three Two One

Three Two One

var labels = $("li").toArray().map(function (el) {
  return el.textContent;
});

console.log(labels.join(", "));  // Apple, Banana, Cherry

Apple, Banana, Cherry

var $li = $("li");

console.log($li.toArray().length);  // 3
console.log($li.get().length);      // 3  (same idea)
console.log($li.get(0).textContent); // Apple

3
3
Apple

var arr = $("#does-not-exist").toArray();

console.log(arr.length);         // 0
console.log(Array.isArray(arr)); // true

0
true

Performance Notes

Cost is proportional to the number of matched elements. For huge sets, convert only when you need Array APIs — otherwise keep chaining on the jQuery object.

Key Takeaways