How to hide dropdown value in JavaScript

Dropdown values in JavaScript refer to the options that are available to select from a dropdown list or a select element in HTML. JavaScript can be used to manipulate the values of a dropdown list in various ways, including adding or removing options, pre-selecting options, or hiding/disabling certain options. Dropdown values are a fundamental aspect of web development that allows developers to create dynamic and user-friendly interfaces for their web applications.

HTML code

In HTML, a dropdown list is created using the <select> element with three <option> elements nested inside it. Each <option> element represents one option that the user can select from the dropdown list. The value of each option is defined using the value attribute of the <option> element.

In this code, we have a dropdown list with the id vehicles and the name of vehicles. The for attribute of the label element is used to associate the label with the dropdown list. Each option in the dropdown list is represented by an <option> element with a value attribute and a visible text label.

JavaScript code

In this code, we first get the dropdown list element using its id (vehicles) and store it in a variable called dropdown. We then use the querySelector method to get the specific option that we want to hide. In this case, we’re using the attribute selector [value='bike'] to select the option with the value of 'bike'.

Finally, we set the display style property of the optionToHide element to "none", which will hide it from the dropdown list.

Note: If you want to show the hidden option again, you can simply set its display style property back to block, inline, or any other valid display value depending on the context.

New on Educative
Learn to Code
Learn any Language as a beginner
Develop a human edge in an AI powered world and learn to code with AI from our beginner friendly catalog
🏆 Leaderboard
Daily Coding Challenge
Solve a new coding challenge every day and climb the leaderboard

Free Resources

Copyright ©2025 Educative, Inc. All rights reserved