Blank out all select list text within option tags

Question

Using this select list as an example:

<select name="my-list" id="my-list">
    <option value="Name 1">Simon</option>
    <option value="Name 2">Frank</option>
    <option value="Name 3">Bob</option>
    <option value="Name 4">Alex</option>
</select>

Using jQuery, I need to blank out all available option text displayed (Simon, Frank, Bob and Alex), i.e. I am after the following instead:

<select name="my-list" id="my-list">
    <option value="Name 1"></option>
    <option value="Name 2"></option>
    <option value="Name 3"></option>
    <option value="Name 4"></option>
</select>

Answer 1

Try

fiddle Demo

$('#my-list option').text('');

---

.text()

$('#my-list option') -->refers to option inside element with id my-list

$('#my-list option').text(''); set text to ''

Answer 2

The proper way would be, But keep in mind that .empty() will also remove the html nodes inside the target element. I am suggesting this because you wanted to clear the contents inside the option tag.

$('#my-list option').empty();

Please read this : http://api.jquery.com/empty/

DEMO