Ignatius Samuel Megis
Ignatius Samuel Megis

Reputation: 185

How to change the text of a Bootstrap 3 button with jQuery?

How to retrieve button text inside tag button?

Example HTML:

<button type="button" class="btn btn-danger" id="dislikes" value="notThisValue">DISLIKES<span class="glyphicon glyphicon-thumbs-down"></span></button>

My jQuery:

$(document).ready(function(){
    $('#dislikes').click(function() {
        $("#dislikes").val('Hello World');
    })
});

I need to change the text DISLIKES to YOU DISLIKE IT. My jQuery has to change the inner text of the button not the value "notThisValue".

Upvotes: 9

Views: 30788

Answers (2)

Hammad
Hammad

Reputation: 2137

The reason you are not able to change the text is that you are changing its value using .val(). Instead you need to use .text() to change tag's text.

Try this.

$(document).ready(function(){
$('#like').click(function() {
 $("#like").text('YOU DISLIKE IT');
})
});

Upvotes: 17

rink.attendant.6
rink.attendant.6

Reputation: 46208

Use .text() or .html():

$(document).ready(function() {
    $('#dislikes').click(function() {
        $(this).text('Hello World');
    })
});

Upvotes: 4

Related Questions