How to get HTML elements by using JQuery?


In many cases, we need to get HTML elements. This post will introduce: How to use JQury to get elements by id, class, tagname, xpath?

Keywords: HTML , element , JQuery , id , class , tagname , xpath.

Import JQuery

When using JQuery to get HTML elements, you need to import the JQuery package firstly. If you do not want to download and save JQuery, you can use CDN to import. After import, we can get element by id, class, tagname and Xpath.

					// CDN import JQuery
// The integrity and crossorigin attributes are used for Subresource Integrity (SRI) checking. 
// This allows browsers to ensure that resources hosted on third-party servers have not been tampered with. 
// Use of SRI is recommended as a best-practice, whenever libraries are loaded from a third-party source. 
//
    <script src="" 


Id Class TagName

In JQuery, you can get elements by Id Class TagName and mixing of them. Note that the object returned by JQuery selector is an array.

					// by tag id
$("#demo") //get id="demo"

// by tagname
$("p")  //get all <p> 

// by class
$("intro") //get all elements which class="intro"

// mix use of id、class、tagname 
$("p.intro") // get all <p> elements which class="intro"
$("p#demo") // get all <p> elements which id="demo"

// get all <a>  elements in <div> that class="example"  
$("div .example a")
$("div.example a")



Using XPath in JQuery to select elements with a given attribute.

					$("[href]")           // get all elements have "href" ttrattibute
$("[href='#']")       // get all elements which href="#"
$("[href!='#']")      // get all elements which href!="#"
$("[href$='.png']")   // get all elements which href endwith ".png" 



When we need to get elements, we can use the powerful JQuery. After importing JQuery through CDN, we can easily get elements by id, class, tagname and Xpath. If you don’t like JQuery, you can also use original Javascript to get elements. For more details, please read the related articles.

Related articles

Coming soon

If yuo have any question or need any help 

you can leave a comment or connect me with

Edit Template

Leave a Reply

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

Chaoxu Wei

Master student at Tongji University (Writer & Blogger)

Job hunting, both part-time and full-time jobs are accepted. Job recommendation please email me, thank you very much!


Edit Template

“There are many people in the world who want to work hard but can’t, and people who work too hard and are exhausted. Please don’t use your efforts only to chase your own victory, please use them to help others.”




Yangpu District, Shanghai