Config Router

  • Google Sheets
  • CCNA Online training
    • CCNA
  • CISCO Lab Guides
    • CCNA Security Lab Manual With Solutions
    • CCNP Route Lab Manual with Solutions
    • CCNP Switch Lab Manual with Solutions
  • Juniper
  • Linux
  • DevOps Tutorials
  • Python Array
You are here: Home / How to change the text of a button in jQuery?

How to change the text of a button in jQuery?

August 20, 2021 by James Palmer

Depends on what type of button you are using

$(“#btnAddProfile”).attr(‘value’, ‘Save’); //versions older than 1.6


$(“#btnAddProfile”).prop(‘value’, ‘Save’); //versions newer than 1.6


$(“#btnAddProfile”).html(‘Save’);

Your button could also be a link. You’ll need to post some HTML for a more specific answer.
EDIT : These will work assuming you’ve wrapped it in a .click() call, of course
EDIT 2 : Newer jQuery versions (from > 1.6) use .prop rather than .attr
EDIT 3 : If you’re using jQuery UI, you need to use DaveUK’s method (below) of adjusting the text property

For buttons created with .Button() in jQuery……..
Whilst the other answers will change the text they will mess up the styling of the button, it turns out that when a jQuery button is rendered the text of the button is nested within a span e.g.

If you remove the span and replace it with text (as in the other examples) – you’ll loose the span and associated formatting.
So you actually need to change the text within the SPAN tag and NOT the BUTTON!
$(“#thebutton span”).text(“My NEW Text”);

or (if like me it’s being done on a click event)
$(“span”, this).text(“My NEW Text”);

Related

Filed Under: Uncategorized

Recent Posts

  • How do I give user access to Jenkins?
  • What is docker volume command?
  • What is the date format in Unix?
  • What is the difference between ARG and ENV Docker?
  • What is rsync command Linux?
  • How to Add Music to Snapchat 2021 Android? | How to Search, Add, Share Songs on Snapchat Story?
  • How to Enable Snapchat Notifications for Android & iPhone? | Steps to Turn on Snapchat Bitmoji Notification
  • Easy Methods to Fix Snapchat Camera Not Working Black Screen Issue | Reasons & Troubleshooting Tips to Solve Snapchat Camera Problems
  • Detailed Procedure for How to Update Snapchat on iOS 14 for Free
  • What is Snapchat Spotlight Feature? How to Make a Spotlight on Snapchat?
  • Snapchat Hack Tutorial 2021: Can I hack a Snapchat Account without them knowing?

Copyright © 2025 · News Pro Theme on Genesis Framework · WordPress · Log in