In this tutorial we will see how to Change Button Text using JQuery. JQuery .html() method is used for this, which will update the text of button.
Table of Contents
HTML Code
HTML Code is given below.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Change Button Text using JQuery</title>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
</head>
<body>
<button id="button">Change Text</button>
</body>
</html>
JQuery Code
JQuery Code is given below. JQuery html() method sets or returns the inner content of the selected html element.
In this code whenever the click event occurs, a function is executed which changes the text of html button with help of html() method.
<script>
$("#button").click(function(){
$(this).html("New Text");
})
</script>
Demo
Video Tutorial
Watch video tutorial on how to Change Button Text using JQuery.