Removing options fom Select using Jquery

Question

<select> <option value="Value 1">Apple</option> <option value="Value 2">Mango</option> <option value="Value 3">Grape</option> <option value="Value 4">Banana</option> </select>

And I have String "Grape" and the result output should be like this.

<select> <option value="Value 1">Apple</option> <option value="Value 2">Mango</option> <option value="Value 4">Banana</option> </select>

How to do that?

Have you tried anything before posting here?

Lix
– Lix

2013-09-24 10:04:35 +00:00
Commented Sep 24, 2013 at 10:04 — Lix
– Lix, Commented Sep 24, 2013 at 10:04

Lix · Accepted Answer · 2013-09-24 10:05:56Z

You'll need to use the jQuery :contains() selector -

:contains() - Select all elements that contain the specified text.

For example:

var txt = "Grape"; var element = $( "#selectElement option:contains('"+ txt +"')" ); element.remove(); // now just remove it

letiagoalves · Accepted Answer · 2013-09-24 10:05:33Z

You can use contains selector and remove function.

$('select option:contains(Grape)').remove();

Working demo

Note: It is better if you give an ID to your select element.

bipen · Accepted Answer · 2013-09-24 10:06:08Z

give your select an id(unique) , use id selector to get the select element. and use :contains selector

$(function(){ $('#givenSelectID option:contains("Grape")').remove(); });

Arun Bertil · Accepted Answer · 2013-09-24 10:13:38Z

Check the Js fiddle

http://jsfiddle.net/CZL2y/

$(document).ready(function() { var txt = "Grape"; var element = $( "select option:contains('"+ txt +"')" ); element.remove(); });

Collectives™ on Stack Overflow

Removing options fom Select using Jquery

4 Answers 4

Comments

Comments

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Related