beginnersbook.com

  • Home
  • All Tutorials
    • Learn Servlet
    • Learn JSP
    • Learn JSTL
    • Learn C
    • Learn C++
    • Learn MongoDB
    • Learn XML
    • Learn Python
    • Learn Perl
    • Learn Kotlin
  • Core Java
  • OOPs
  • Collections
  • Java I/O
  • JSON
  • DBMS

jQuery Multiple Elements Selector

By Chaitanya Singh | Filed Under: jQuery

In the previous tutorials we have learned what are jQuery selectors and what is an element selector. In this guide, we will learn jQuery multiple elements selector.

Syntax

To select multiple elements of an html page using multiple elements selector, we pass the element names inside parenthesis, in double quotes, separated by commas.

$("element1, element2, element3")

For example: $(“div, p, h2”) this will select all the div, p and h2 elements of a page.

jQuery Multiple Elements Selector Example

In the following example we are selecting and changing the background colour of three elements (h2 heading element, a element, button element) on the button click event.

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $("h2, a, button").css("background-color", "green");
  });
});
</script>
</head>
<body>

<h2>jQuery multiple elements selector example</h2>
<p>This tutorial is published on
<a href="https://beginnersbook.com">Beginnersbook</a> website</p>
<h2>This is another h2 heading</h2>
<button>Click Me!</button>
</body>
</html>

Output:
Before the button is clicked:
jQuery Multiple Elements Selector
After the button is clicked:
jQuery Multiple Elements Selector Example

❮ PreviousNext ❯

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

jQuery Tutorial

  • jQuery Tutorial
  • jQuery Selectors
  • jQuery Events

jQuery Effects

  • jQuery Show & Hide
  • jQuery Fading
  • jQuery Sliding
  • jQuery Animate
  • jQuery stop()
  • jQuery Callback Function
  • jQuery Chaining

jQuery HTML/CSS

  • jQuery html()

Recently Added..

  • JSON Tutorial
  • Java Regular Expressions Tutorial
  • Java Enum Tutorial
  • Java Annotations Tutorial

Copyright © 2012 – 2021 BeginnersBook . Privacy Policy . Sitemap