JQuery get the title of a button

I have a button:

<button type="button" onclick="toggleColor('white');" >White</button>

Which makes this:

Is there any way to get what is written on the button using jQuery. For example this button would return White because its in-between the 2 button tags.

You can get it by using .text(),

$('button').text();

Please read here to know more about it.

add id to your button like this

<button type="button" onclick="toggleColor('white');" id="your_button_id" >White</button>

now you can use JS like this

var button_text = document.getElementById('your_button_id').innerHTML;

and also you can use JQUERY like this

var button_text = $('#your_button_id').text();

Try

$("button").click(function(){
var title=$(this).attr("value");
alert(title);
});

You can do this with Vanilla JS, after you've added an ID so you can fetch the element.

Assuming:

<button type="button" onclick="toggleColor('white');" id='myButton'>White</button>

You can do in JavaScript:

var someVar = document.getElementById('myButton').innerHTML; // -> White
var anotherVar = document.getElementById('myButton').textContent; // -> White

Both will hold "White"

give the button an ID

<button id="btnTest" type="button" onclick="toggleColor('white');" >White</button>

JQuery:

alert($("#btnTest").text());

Just provide one id to button and use it with JQuery

<button id=btn type="button" onclick="toggleColor('white');" >White</button>

then use jquery like this

$("#btn").val();

it will work for your condition.

Try this event.target

$("button").click(function(event){
var text=$(event.target).attr("value")
alert(text);
});

This worked for me on chrome.

$("#your-button-id").val();