Clear items from DropDownList (or) Select in jQuery.


In this article i will explain how to clear items from DropDownList (or) Select in jQuery.


In previous articles i explained How to replace string in Java ScriptHow many ways we can replace the string in Java ScriptHow to work with TextBox in Java ScriptHow to create a HTML Table dynamically in Java ScriptHow to Create/Insert rows dynamically to HTML Table and Remove/Delete rows from HTML Table in Java Script and How to replace string in jQuery. Now i will explain how to clear items from DropDownList (or) Select in jQuery.

Clear items from DropDownList (or) Select in jQuery:

We can clear items from DropDownList (or) select by using below script:



You can also find the complete example as shown below:

Full Source Code:

<html xmlns="">
    <title>How to work with DropDownList (or) Select in jQuery</title>
    <script src="Scripts/jquery-1.11.1.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        function ClearItems() {
        <select id="ddlRole" class="form-control">
            <option value="-1">Select</option>
            <option value="1">User</option>
            <option value="2">Admin</option>
            <option value="3">Super Admin</option>
        <input type="button" value="Clear" onclick="ClearItems(this)" />

In the above example, it will clear all the items from DropDownList (or) Select when we click on Clear button. empty() is a predefined jQuery method.


Before Clear


After Clear


Here we need to add jQuery library file reference. It is mandatory.