Skip to content
Related Articles
Open in App
Not now

Related Articles

p5.js | selectAll() Function

Improve Article
Save Article
  • Last Updated : 29 Jan, 2020
Improve Article
Save Article

The selectAll() function is used to search for elements with the given id, class or tag name and return it as a p5.Element array. It has a syntax similar to the CSS selector. An optional parameter is available that can be used to search within a given element. This method returns all the elements that exist on the page and matches the selector.


selectAll(name, [container])

Parameters: This function accept two parameters as mentioned above and described below:

  • name: This is a string which denotes the id, class or tag name of the element that has to be searched.
  • container: This is an optional parameter which denotes an element to search within.

Returns: It returns a p5.Element array that contains all the matched elements.

Below example illustrates the selectAll() function in p5.js:


function setup() {
  createCanvas(600, 50);
  text("Click to select the paragraphs"+
       " and change their position.", 0, 20);
  para1 = createP("This is paragraph 1");
  para2 = createP("This is paragraph 2");
  para3 = createP("This is paragraph 3");
function mouseClicked() {
  // Select all the
  // paragraph elements
  selectedParas = selectAll("p");
  // Loop through each of them
  for (i = 0; i < selectedParas.length; i++) {
    // Change the position of
    // of the elements
    selectedParas[i].position(100, 100 + i * 25);


Online editor:

Environment Setup:


My Personal Notes arrow_drop_up
Related Articles

Start Your Coding Journey Now!