Add a new option to drop down using java script and jquery

Sometimes the developer will need to add a new option to the select (drop down/list) dynamically. You can achieve this by using java script or jquery. The below code will add a new option to the existing select input field. The id of the select is the selector used in the case, you can use other selectors too.To add a new option dynamically to drop down the following java script code can be used,

var newoption = document.createElement("OPTION");
        newoption .text = 'Option_display_text';
        newoption .value = 'Option_value';
        document.getElementById('DROPDOWN_ID').options.add(newoption ); 

same can be achieved using jquery using this snippet,

$("#DROPDOWN_ID").append('<option value="Option_value">Option_display_text</option>');

For e.g:- if the html for select (drop down) is like this,

<select id="country">

<option value="India" >India</option>

<option value="KSA" >KSA</option>

<option value="UK" >UK</option>

<option value="USA" >USA</option>

</select>

to insert a new option quatar then the javascript code will look like this,

var newoption = document.createElement("OPTION");
        newoption .text = 'quatar';
        newoption .value = 'quatar';
        document.getElementById('country').options.add(newoption );

and in jquery it is like this,

$("#country").append('<option value="Quatar">Quatar</option>');