javascript - Hide submit button if selected option value is null -

i have following form:

var x = document.getelementbyid("submit-button");    if (x.selectedindex.value == null) {  $("#submit-button").css("display","none");  }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <form>  <select>    <option disabled selected>select colour</option>    <option value="orange">orange</option>    <option value="apple">apple</option>    <option value="lemon">lemon</option>  </select>    <button id="submit-button" type="submit">click</button>  </form>

if selected index of dropdown disabled placeholder option no value, want hide submit button. colour selected want show button again.

any appreciated.

you in right way. missing points events:

1 - whole code must executed when dom ready (document loaded)

2 - must observe select change event check changes

3 - can use jquery .hide() , .show() control element's visibility

// executed when dom loaded $(document).ready(function() {    // executed when select changed     $("select").on('change',function() {         var x = this.selectedindex;          if (x == "") {            $("#submit-button").hide();         } else {            $("#submit-button").show();         }     });      // must not visible @ first time     $("#submit-button").css("display","none"); });  

look working fiddle