Selector button
The selector :button
selects button elements and all elements with the type button
. See the tags button
, input
with the type button
. The equivalent of $(':button')
is $('button')
, $("input[type='button']")
. Since :button
is not part of the CSS specification, for better performance in modern browsers it is better to first filter the elements using a pure CSS selector and then apply .filter(':button')
.
Syntax
This is how we select buttons:
$(':button');
Example
Let's, according to the theory above, select all the buttons and give them a green background and a red border by adding the class marked
to them using the addClass
method:
<form>
<input type="button" value="button">
<input type="file">
<button>button</button>
<input type="reset">
<input type="radio">
<input type="text">
</form>
.marked {
background-color: green;
border: 2px red solid;
}
$(':button').addClass('marked');
$('form').submit(function(event) {
event.preventDefault(); // prevents form submission
});