Close a SELECT dropdown list programmatically with Javascript/jQuery

I think all you need to do is target something else or should I say lose focus on the select (blur it)

<select>
    <option value="0">Initial Value</option>
</select>

var $select = $('select');
$select.click(function(e){

    $select.html('<option value="-1">Loading</option>');

    $.ajax({
        url: '/echo/json/',
        method:'post',
        dataType: "json",
        contentType: "application/json; charset=utf-8",
        data: { json: JSON.stringify([1, 2, 3]), delay:1 }
    }).done(function(data){

        $.each($.map(data, function (item, i) {
                    return "<option value='" + item +"' >" + item + "</option>";

                }), function (i, item) {
                    $element.append(item);
                });

    }).fail(function(){
        alert('error');
    });

   e.preventDefault();
   e.stopPropagation(); 
   $(this).blur();    
});

After...

$select.html('<option value="-1">Loading</option>');

Try adding...

$select.blur();

Just add this line end of your close within click.

$(this).blur();  

So it will look like

$select.click(function(e){

    $select.html('<option value="-1">Loading</option>');

    $(this).blur();
    ......
    ...
});

DEMO

HAH ! If we have an issue with Chrome new version then:

Take a fake select like following:

<select class="fake" style="display: none">
    <option value="-1">Loading</option>
</select>

and do something like:

$select.click(function(e) {
    $(this).hide(0); // hide current select box

    //$select.html('<option value="-1">Loading</option>');

    $('select.fake').show(0); // show the fake slide

    $.ajax({
           // your code
        }).done(function(data) {

           $('select.fake').hide(0);
           $select.show(0);

        })
        ......
    }):

DEMO

I'm not sure about anyone else, but I'm using the latest stable build of Chrome, and none of the other answers involving .blur() work for me.

This question asks the inverse: Programmatically open a drop-down menu

The conclusion that seemed to be obtained is that it's not possible due to the way the browser handles field element clicks.

A better solution would be to replace the dropdown with a pure HTML one and hide it when needed with a simple .hide() command.