Jquery Selectors

The element Selector

The jQuery element selector selects elements based on the element name.

You can select all <p> elements on a page like this:

 

$(document).ready(function(){
  $("button").click(function(){
    $("p").hide();
  });
});

 

The #id Selector

The jQuery #id selector uses the id attribute of an HTML tag to find the specific element.

An id should be unique within a page, so you should use the #id selector when you want to find a single, unique element.

To find an element with a specific id, write a hash character, followed by the id of the HTML element:

$(document).ready(function(){
  $("button").click(function(){
    $("#test").hide();
  });
});

 

The .class Selector

The jQuery .class selector finds elements with a specific class.

To find elements with a specific class, write a period character, followed by the name of the class:

$(document).ready(function(){
  $("button").click(function(){
    $(".test").hide();
  });
});
Scroll to Top