Easy Tutorial
❮ Jsref Getutcseconds Jsref Getutcday ❯

Select add() Method


Definition and Usage

The add() method is used to add an <option> element to a <select>.

Syntax

Parameter Description
option Required. The option element to add. Must be an option or optgroup element.
before Required. Adds the new element before this element in the array of options. If this parameter is null, the element is added to the end of the array of options.

Browser Support

All major browsers support the add() method.

Note: The add() method requires a !DOCTYPE declaration in IE8 and later versions of IE.


Example

The following example adds a "Kiwi" option to the end of the dropdown list:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>tutorialpro.org(tutorialpro.org)</title>
<script>
function displayResult(){
    var x=document.getElementById("mySelect");
    var option=document.createElement("option");
    option.text="Kiwi";
    try{
        // For earlier versions of IE8
        x.add(option,x.options[null]);
    }catch (e){
          x.add(option,null);
    }
}
</script>
</head>
<body>

<form>
<select id="mySelect">
    <option>Apple</option>
    <option>Pear</option>
    <option>Banana</option>
    <option>Orange</option>
</select>
</form>
<br>
<button type="button" onclick="displayResult()">Insert Option</button>
<p><b>Note:</b> The add() method works in IE8 or later if a !DOCTYPE declaration is added to the page. Additional code is needed for versions prior to IE 8.</p>
</body>
</html>

More Examples

Add an option before the selected option in the dropdown list


❮ Jsref Getutcseconds Jsref Getutcday ❯