Skip to content
Fix Code Error

How to change the text of a button in jQuery?

March 13, 2021 by Code Error
Posted By: Anonymous

How do you change the text value of a button in jQuery? Currently, my button has ‘Add’ as its text value, and upon being clicked I want it to change to ‘Save’. I have tried this method below, but so far without success:

$("#btnAddProfile").attr('value', 'Save');

Solution

Depends on what type of button you are using

<input type='button' value='Add' id='btnAddProfile'>
$("#btnAddProfile").attr('value', 'Save'); //versions older than 1.6

<input type='button' value='Add' id='btnAddProfile'>
$("#btnAddProfile").prop('value', 'Save'); //versions newer than 1.6

<!-- Different button types-->

<button id='btnAddProfile' type='button'>Add</button>
$("#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

Answered By: Anonymous

Related Articles

  • Is CSS Turing complete?
  • How to show title in hover - css / jquery
  • Reference - What does this regex mean?
  • Rails wrong number of arguments error when generating…
  • How to write down nested schemas for mongoose using NestJS…
  • Form field border-radius is not working only on the last…
  • CSS Float: Floating an image to the left of the text
  • D3.js: Update barplot based on variable input
  • d3.js - draw arrow line from border to border
  • Homebrew install specific version of formula?

Disclaimer: This content is shared under creative common license cc-by-sa 3.0. It is generated from StackExchange Website Network.

Post navigation

Previous Post:

Use of *args and **kwargs

Next Post:

How to mock void methods with Mockito

Leave a Reply Cancel reply

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

  • Get code errors & solutions at akashmittal.com
© 2022 Fix Code Error