How to append an option to a select box using jQuery?
Robert Miller
Published Feb 17, 2026
How to append an option to a select box using jQuery?
The Option () constructor is used to create a new option element. For creating a new option, the text and the value parameters are used. Then, the element is appended to the select box with the append () method:
How to disable selected option from select input element in HTML?
To disable the selected option from select input element, following piece of code can be used, $ (“#selectid option:selected”).attr (‘disabled’,’disabled’); and to enable an option that is disabled already, $ (“#selectid option [value=”somevalue”]”).removeAttr (‘disabled’); In this example, let us have one div for each option
How to disable or enable dropdown list using jQuery?
You can use jQuery .prop () method to change the properties of an HTML element, dynamically, that is, at runtime. So, let’s see how we can use the .prop () method to disable or enable a dropdown list.
How to manipulate Dom elements using jQuery?
With jQuery, it is easy to manipulate DOM elements and write lesser code than we would write in Javascript. In this example, I am going to disable selected options and display it in a div when selected. The users will have an option to again enable the selected option by removing it from the selected options div.
A new jQuery DOM element is created with the option tag. The value of the tag is set with the val () method and the text of the option is set with the text () method. The element created is then added to the select box with the append () method.
What is the use of append in jQuery?
Within the function, this refers to the current element in the set. The .append () method inserts the specified content as the last child of each element in the jQuery collection (To insert it as the first child, use .prepend () ).
How do I remove a selected option from a select box?
Remove Options. To remove an option, you can use the remove() method of jQuery. This will remove the selected option from the select box.
How do you execute code in jQuery?
By design, any jQuery constructor or method that accepts an HTML string — jQuery(), .append(), .after(), etc. — can potentially execute code. This can occur by injection of script tags or use of HTML attributes that execute code (for example, ).