removing all options of select box except 1st option

I'm trying to empty select options when:

id "mClick" is selected, id's "sClick", "cClick" and "srClick" will be emptied.

id "sClick" is selected, id's "cClick" and "srClick" will be emptied.

id "cClick" is selected, id "srClick" will be emptied.

<form action="javascript:void(0);" method="POST" id="lForm">
<table>
    <tr>
        <td>
            <select name="module" id="mClick">
                <option value="">Select Mod</option>
                <option value="1">Mod 1</option>
                <option value="2">Mod 2</option>
                <option value="3">Mod 3</option>
            </select>
        </td>
        <td>
            <select name="state" id="sClick">
                <option value="">Select State</option>
                <option value="1">State 1</option>
                <option value="2">State 2</option>
            </select>
        </td>
        <td>
            <select name="city" id="cClick">
                <option value="">Select City</option>
                <option value="1">City 1</option>
                <option value="2">City 2</option>
            </select>
        </td>
        <td>
            <select name="services" id="srClick">
                <option value="">Select Services</option>
                <option value="1">Services 1</option>
                <option value="2">Services 2</option>
            </select>
        </td>
    </tr>
</table>

in scenario 3, i used this function, but it deleted all, except the last select. Any idea's what i'm missing? Thanks

$('#lForm select[id!="mClick"] select[id!="sClick"] select[id!="cClick"] option[value!=""]').remove().end();

Solution 1:

Try this

yourSelect.find('option').not(':first').remove();

Solution 2:

I was looking for one line code, what I found after lots of research is the Simplest and Best one line code to remove everything except first.

JQuery,

$('#ddlId option:not(:first)').remove();

Solution 3:

you can use the greater than :gt() selector of jQuery for this

$('#lForm select[id!="makeClick"] select[id!="stateClick"] select[id!="cityClick"] option:gt(0)').remove().end();

This will remove all options that are greater than 0

Solution 4:

You can use not(:first)

$('#lForm select[id!="makeClick"] select[id!="stateClick"] select[id!="cityClick"]  option:not(:first)').remove().end();