jQuery to remove all except one or first or last item from select option(dropdown)

Introduction: Here in this article I am going to explain how to remove all items from the dropdown except the first item, last item or any one as per requirement from the select element i.e. dropdownlist using jQuery. 
jQuery to remove all except one or first or last item from select option(dropdown)

In previous articles I have explained How to Remove item by value or text or index from dropdown  and Remove first, last or selected item from dropdown and Remove multiple or all items from dropdown and  Auto resize textarea or asp.net multiline textbox based on content using javascript and Difference between .empty() and .remove jquery methods with examples

Description: jQuery provides some interesting methods that would help remove items (options) from dropdown. We can remove all the items, multiple items or remove specific (single) item, remove all except first, remove all except last, remove all except one, remove first item, remove last item, remove selected item, remove item by item text/value/index as per requirement.

But here in this article I am going to demonstrate how to remove all items except first or last or any one item from dropdown using jQuery.

Implementation: Let's understand by suitable examples:

<html>
<head>
    <title>Examples to remove all first or last or selected item from dropdown.</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <script>
        $(document).ready(function () {
            $("#btnRemoveAllExceptFirst").click(function () {
                $('#ddlItems option:not(:first)').remove();
            });

            $("#btnRemoveAllExceptLast").click(function () {
                $('#ddlItems option:not(:last)').remove();
            });

            $("#btnRemoveAllExceptOne").click(function () {
                $('#ddlItems option[value!="2"]').remove();
            });
        });
    </script> 
</head>

<body>
    <select id="ddlItems" style='width:240px;'>
        <option value="1">Item1</option>
        <option value="2">Item2</option>
        <option value="3">Item3</option>
        <option value="4">Item4</option>
        <option value="5">Item5</option>
    </select><br /><br />

    <input type="submit" id="btnRemoveAllExceptFirst" value="Remove all except First" />
    <br />
    <input type="submit" id="btnRemoveAllExceptLast" value="Remove all except Last" />
    <br />
    <input type="submit" id="btnRemoveAllExceptOne" value="Remove All except One" />
</body>
</html>

Note: Refresh page after clicking any button to re-populate items in dropdown that might be deleted due to any of the other button click.

Explanation: 

If we want to remove all items from dropdown except the first item then we can use $('#ddlItems option:not(:first)').remove(); Here we have excluded first item from being deleted.

If we want to remove all items from dropdown except the last item then we can use $('#ddlItems option:not(:last)').remove(); Here we have excluded last item from being deleted.

If we want to remove all items from dropdown except the one we specify e.g Item2 then we can use $('#ddlItems option[value!="2"]').remove(); Here we have excluded one item i.e  Item2 whose value is 2 from being deleted.

Now over to you:
A blog is nothing without reader's feedback and comments. So please provide your valuable feedback so that i can make this blog better and If you like my work; you can appreciate by leaving your comments, hitting Facebook like button, following on Google+, Twitter, Linked in and Pinterest, stumbling my posts on stumble upon and subscribing for receiving free updates directly to your inbox . Stay tuned and stay connected for more technical updates.
Previous
Next Post »

If you have any question about any post, Feel free to ask.You can simply drop a comment below post or contact via Contact Us form. Your feedback and suggestions will be highly appreciated. Also try to leave comments from your account not from the anonymous account so that i can respond to you easily..