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

Written by Ian Carnaghan · 24 sec read >

You have a html select box “combo box”  

<select id="selectBox">

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


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.

Last Updated On March 21, 2018
Written by Ian Carnaghan
I am a software developer and online educator who likes to keep up with all the latest in technology. I also manage cloud infrastructure, continuous monitoring, DevOps processes, security, and continuous integration and deployment. Profile

Leave a Reply

Notify of