jQuery Name Selector

The element name selector is the most common selector. By using the element selector we can apply the jQuery effect on all elements with few lines of code.

Syntax of name selector

$("element") 

Here, an element is the html tag name to select. This can be any standard HTML tag name.

Example 1

<div>
<b>Hello John!</b>
<p>How are you?</p>
</div>

<script>
$(document).ready(function(){
$("div").css("background-color", "yellow");
$("p").css("color", "blue");
$("b").css("color", "red");
});
</script>

Output of the above code

jQuery Name Attribute

In the above example, $("div") selects all the elements of the div tag and set background color to the whole div reason. Similarly, $("p") selects all elements of p tag and set the font color to blue and $("b") selects all the elements of b tag and set the font color to red.


Example 2

<button>Click Here</button>
<h5>Welcome to this World!</h5>
<script>
$(document).ready(function(){
$("button").click(function(){
$("h5").hide();
});
});
</script>

Output of the above code

Welcome to this World!

In the above example, on click the button element, all the <h5> elements are hidden.