How to remove all options within a Html select box using JQuery

No Comments

You have a html select box “combo box”  

<select id="selectBox">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
</select>

In order to remove all items using JQuery use the JQuery empty function

$('#selectBox').empty();

Replace selectBox with the relevant id for the select box

If you wish to empty the select box and add a single option to the select box, use JQuery’s append function together with the empty function

$('#selectBox').empty().append('<option>New Option</option>');

This will add the New Option to the select box.

Image Credits: Photo by Isis França on Unsplash.

Last Updated On March 21, 2018

Related Articles

No results found

Leave a Reply

avatar
  Subscribe  
Notify of
Menu
Copy link