Hiding Opetions of a Selection with JQuery

Posted by Syed Abdul Rahman on Stack Overflow See other posts from Stack Overflow or by Syed Abdul Rahman
Published on 2011-01-15T11:50:16Z Indexed on 2011/01/15 11:53 UTC
Read the original article Hit count: 304

Filed under:
|
|
|
|

Okay, let's start with an example.

<select id = "selection1">
    <option value = "1" id = "1">Number 1</option>
    <option value = "2" id = "2">Number 2</option>
    <option value = "3" id = "3">Number 3</option>
</select>

Now from here, we have a dropdown with 3 options.
What I want to do now is to hide an option.

Adding style = "display:none" will not help.
The option would not appear in the dropdownlist, but using the arrow keys, you can still select it.
Essentially, it does exactly what the code says. It isn't displayed, and it stops there.

A JQuery function of $("1").hide() will not work.
Plus, I don't only want to hide the option, I want to completely remove it.

Any possibility on doing so?
Do I have to use parent/sibling/child elements? If so, I'm still not sure how.

Any help on this would be greatly appreciated. Thanks.

© Stack Overflow or respective owner

Related posts about jQuery

Related posts about select