handlebars helper output not being displayed in template

Question

I've got a handlebars helper method which is fetching a json object through ajax and I then want to format that json into html and inject it into the template.

I build the html and output to the console, and see the output properly, but
the result of the handlebars helper never gets displayed in the template.

Handlebars.registerHelper("accounts_dropdown", function() {
    function get_dropdown(callback){
    var dropdown='Select Account';

    $.ajax({
        url: 'accounts',
        success: function(response){
            for(var i=0;i<response.length;i++){
            dropdown+=' < option value="'+response[i].id+'">'+response[i].name+'</option>';
                }

            callback(dropdown);
            }
        });
    }

    get_dropdown(function(dropdown){
        console.log(dropdown);
        return new Handlebars.SafeString(dropdown);
    });
  });

and in my template I have

 {{accounts_dropdown}}