How to populate dropdownlist from database in ASP.NET MVC using ajax

See more:

Javascript

jQuery

i have a dropdownlist in my mvc application which is loaded when the page load but i dont wantto do that instead i want to click the dropdown and load entire data is it possoble?

What I have tried:

<script>
$("#countrySelect").change($(document).ready(function () {
debugger;
$.get('Home/countrySelectList', function(data) {
console.log(data)
$.each(data, function(index, value) {
$('<option>').val(value).text(value).appendTo("#countrySelect");
});
});
}));
</script>