javascript - How can I select using jQuery 'select' tag with determined selected option? -

for instance,

<div id="wrapper">     <select>         <option value="en" selected="selected">english</option>         <option value="ar">العربية</option>         <option value="az">azərbaycanlı</option>         <option value="bg">български</option>         <option value="ca">català</option>         <option value="cs">český</option>         <!-- data cut -->     </select> <select>         <option value="en" >english</option>         <option value="ar">العربية</option>         <option value="az" selected="selected">azərbaycanlı</option>         <option value="bg">български</option>         <option value="ca">català</option>         <option value="cs">český</option>         <!-- data cut -->     </select> <select>         <option value="en" >english</option>         <option value="ar">العربية</option>         <option value="az" selected="selected">azərbaycanlı</option>         <option value="bg">български</option>         <option value="ca">català</option>         <option value="cs">český</option>         <!-- data cut -->     </select> </div> 

how can select 'select' tag value="az"

i've found way:

var val_ = "az";     var selects = $div.find("select").filter(function(index_){                 var val0 = $(this).val();                 return val0 == val_;             }); 

is there more elegant way it?

edit. question 'select' tag. of questions in stackoverflow child 'option' tag.

1. you can use attribute equals selector [attribute='value'],for selecting using particular value
2. use :has() selector checking selected option value
3. :selected selector getting selected option

code:

$('select:has(:selected[value="az"])') 

with variable can

var val_ = "az"; var selects = $('select:has(:selected[value="' + val_ + '"])'); 

for example :

var val_ = "az";  $('select').change(function() {    var selects = $('select:has(:selected[value="' + val_ + '"])');    console.log(selects.length);  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>  <div id="wrapper">    <select>      <option value="en" selected="selected">english</option>      <option value="ar">العربية</option>      <option value="az">azərbaycanlı</option>      <option value="bg">български</option>      <option value="ca">català</option>      <option value="cs">český</option>      <!-- data cut -->    </select>    <select>      <option value="en">english</option>      <option value="ar">العربية</option>      <option value="az" selected="selected">azərbaycanlı</option>      <option value="bg">български</option>      <option value="ca">català</option>      <option value="cs">český</option>      <!-- data cut -->    </select>    <select>      <option value="en">english</option>      <option value="ar">العربية</option>      <option value="az" selected="selected">azərbaycanlı</option>      <option value="bg">български</option>      <option value="ca">català</option>      <option value="cs">český</option>      <!-- data cut -->    </select>  </div>