jQuery Get Element By Class


jquery jQuery Get Element By Class Jquery Functions

How can we access the HTML element using class name with jQuery ?

Elements with particular class can be easily accessed with jQuery . As per jQuery function syntax , starts with $ then in parenthesis we will pass the class name with dot ( . ) at the start.

Syntax of get Element By Class name using jQuery

$(".ClassName");

We are now going to building our jQuery Class access by Example below.

On Click Assign Dashed red Border to the HTML Elements with class="myclass"

First we will get access to the HTML elements with class="myclass" then using the jQuery CSS function css() function we will assign the dashed border.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <button class="myclass"> Click Me </button> <div class="myclass" >Welcome to CodingPk jQuery Tutorial Get Element By Class </div> <script type="text/javascript"> $("button").click(function() { $(".myclass").css("border","dashed 1px red"); }); </script>

Output of above code get Element By Class

Welcome to CodingPk jQuery Tutorial Get Element By Class
Note. We can also access HTML element by Class at particular index like below.

Select HTML elements with Class at particular index

$(".myclass").eq(1).css("border","solid red 1px"); Index will start from 0.
  • First HTML element with class="myclass" index will be Zero i.e eq(0).
  • Second HTML element with class="myclass" index will be One i.e eq(1).
  • jquery Jquery Functions Chapter Next »