## selected selector

Description: Selects all elements that are selected.

- #### version added: 1.0jQuery( ":selected" )

The `:selected` selector works for `<option>` elements. It does not work for checkboxes or radio inputs; use `:checked` for them.

### Additional Notes:

- Because `:selected` is a jQuery extension and not part of the CSS specification, queries using `:selected` cannot take advantage of the performance boost provided by the native DOM `querySelectorAll()` method. To achieve the best performance when using `:selected` to select elements, first select the elements using a pure CSS selector, then use `.filter(":selected")`.

## Example:

Attaches a change event to the select that gets the text for each selected option and writes them in the div. It then triggers the event for the initial text draw.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 |
    <!doctype html><html lang="en"><head>  <meta charset="utf-8">  <title>selected demo</title>  <style>  div {    color: red;  }  </style>  <script src="https://code.jquery.com/jquery-1.10.2.js"></script></head><body> <select name="garden" multiple="multiple">  <option>Flowers</option>  <option selected="selected">Shrubs</option>  <option>Trees</option>  <option selected="selected">Bushes</option>  <option>Grass</option>  <option>Dirt</option></select><div></div> <script>$( "select" )  .change(function() {    var str = "";    $( "select option:selected" ).each(function() {      str += $( this ).text() + " ";    });    $( "div" ).text( str );  })  .trigger( "change" );</script> </body></html>

#### Demo: