Get Text of HTML Element using JQuery

In this tutorial we will see how to Get Text of HTML Element using JQuery. JQuery text() method is used which will return the text of HTML element.

Table of Contents

HTML Code

HTML Code is given below, In this code we have a paragraph element and button tag.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Get Text of HTML Element using JQuery</title>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
</head> 
<body>
  <p>HowToCodeSchool.com</p>
  <button>Get Text</button>
</body>
</html>

JQuery Code

JQuery Code is given below, In this code JQuery text() method is used which sets or returns the text of the selected element.

In this example text() method will read the text of paragraph element and alert method will display it through alert box.


<script>
$(document).ready(function(){  
$("button").click(function(){
alert($("p").text());
 });
});
</script>

Demo

Check Demo

Video Tutorial

Watch video tutorial on how to Get Text of HTML Element using JQuery.