How to get value of a button type button with jQuery?

Question

I use instead of I simply wish to get the value/content of the selected/active button, with jQuery, on click button and onload page.

These are my buttons:

<button type="button" class="green test">Button 1</button>
<button type="button" class="green active test">Button 2</button>

I know I must to use $(".test:button") selector, but I don't know how to get the button content

Hi guys, the problem is I have more button with the same class and I need to know the value of SELECTED button. In my example I have the 'Button 2' with class = "green active test". Is there a way to know the value of a selected button OR a button which contains "active" attribute in class? — Tab
– Tab, Commented Aug 8, 2013 at 9:43
Hi @Anton, the problem is that I have more buttons with the same "active" class, e.g.: <button class="green active">Button 1</button> <button class="green">Button 2</button> <button class="red active">Button 3</button> <button class="red">Button 4</button> So, I cannot only use .active selector — Tab
– Tab, Commented Aug 9, 2013 at 8:40
So you want to select a button which has green or red and active? — Anton
– Anton, Commented Aug 9, 2013 at 8:42
yes! I wish to select more classes: e.g.: 'green' AND 'active' — Tab
– Tab, Commented Aug 9, 2013 at 11:05

Anton · Accepted Answer · 2013-08-09 11:13:27Z

4

Use .text()

$(document).ready(function(){

    alert($('.test[type="button"]').text());

    $('.test[type="button"]').on('click',function(){
         alert($(this).text());
    });

});

DEMO

Edit

var text = $('button.active').text();

Edit

var redsText = $('button.red.active').text();
var greensText = $('button.green.active').text();

edited Aug 9, 2013 at 11:13

answered Aug 8, 2013 at 8:36

Anton

32.6k5 gold badges47 silver badges54 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Subdigger · Accepted Answer · 2013-08-08 08:35:44Z

1

$('button').text();

or

$('button').html();

answered Aug 8, 2013 at 8:35

Subdigger

2,2133 gold badges21 silver badges43 bronze badges

Comments

Suresh Atta · Accepted Answer · 2013-08-08 08:36:25Z

1

Try

 $('button.test').click(function() {
        alert($(this).text());
    });

WORKING DEMO

answered Aug 8, 2013 at 8:36

Suresh Atta

122k38 gold badges206 silver badges315 bronze badges

Comments

Ramki · Accepted Answer · 2013-08-08 08:47:35Z

0

<head> 
<script type="text/JavaScript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
</head>
<button type="button" class="green test">Button 1</button>
<button type="button" class="green active test">Button2</button>
<script>
$(function(){
$(".green").click(function(){
$(this).addClass('active');

    $(this).siblings().removeClass("active")
alert($(this).text());
})
 })
</script>

answered Aug 8, 2013 at 8:47

Ramki

1661 silver badge13 bronze badges

Collectives™ on Stack Overflow

How to get value of a button type button with jQuery?

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related