Select text, value, remove, selecteIndex on select element

1. Add options to the end of a select

$("#drpCountry").append('India');

$("#drpCountry").append('Indonesia');

or

$('India').appendTo($("#drpCountry"));

$('Indonesia').appendTo($("#drpCountry"));

2. Add options to the start of a select

$("#drpCountry").prepend('Nepal');

3. Replace all the options with new options

$("#drpCountry").html('Sri LankaUAEUSA');

4. Replace items at a certain index

$("#drpCountry option:eq(1)").replaceWith('Landon');

$("#drpCountry option:eq(2)").replaceWith('France');

5. Set the element at index 2 to be selected


$("#drpCountry option:eq(2)").attr("selected", "selected");

6. Set the selected element by text

$("#drpCountry").val("India").attr("selected", "selected");

7. Set the selected element by value

$("#drpCountry").val("2");

8. Remove an item at a particular index

$("#drpCountry option:eq(0)").remove();

9. Remove first item

$("#drpCountry option:first").remove();

10. Remove last item

$("#drpCountry option:last").remove();

11. Get the text of the selected item

var selectedtext=$("#drpCountry option:selected").text();

12. Get the value of the selected item

var selectedvalue=$("#drpCountry option:selected").val();

13. Get the index of the selected item

var selectedIndex=$("#drpCountry option").index($("#drpCountry option:selected"));

14. Alternative way to get the selected item

var selectedItem=$("#drpCountry option:selected").prevAll().size();

15. Insert an item in after a particular position

$("#drpCountry option:eq(0)").after("Pakistan");

16. Insert an item in before a particular position

$("#drpCountry option:eq(3)").before("Dubai");

17. Getting values when item is selected

$("#drpCountry").change(function() {

var Selectedvalue=$(this).val();

var Selectedtext=$(this).children("option:selected").text();

});