How to access the option in a select tag and add css to it

Question

As we check if the option in select tag does not, how can we hide it?

I have checked the existence of an option by:

data_name="Class1"
if ( $("#select_id option[value=data_name").length > 0 ){
      //add css to the option 
     //How to access the option. I want to do (option).css('display':'none')
}

How to access the option here?

Answer 1

You just need to do proper concatenation.

var data_name = "Class1";
var option = $("#select_id option[value='" + data_name + "']");
option.css('color', 'red');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<select id="select_id">
  <option value="">gdgdfgf</option>
  <option value="Class1">dfgdfgfdg</option>
  <option value="">dfgdfgdfg</option>
</select>