Return String Value From Ajax Query

Question

This may be a lack of truly understanding jQuery, but I am trying to create a function that calls a handler that return a single string value (a concatenation of several strings in a sql query). These values are then combined and saved as one string value and returned and stored as a variable for later use.

I can confirm the hanlder works. The internal displayList variable does collect the proper information. That is not the issue. The issue is how to return this output value to the original call.

Below is a sample.

$(document).ready(function () {
    // Get Drop Down List Options
    var listValues = populateDropDown(9);

    // Returns "" Instead Of Full String
    alert(listValues);         
});

function populateDropDown(iCategoryID) {

        var displayList = "";

        $.ajax({
            url: "queries/dh_getListInfo.ashx",
            contentType: "application/json; charset=utf-8",
            cache: false,
            dataType: "json",
            data: {
                iCategoryID: iCategoryID,
            },
            responseType: "json",
            success: function (response) {

                // Loop Through Values And Build String
                if (response.length != 0) {
                    $.each(response, function (index, row) {
                        for (var index in row) {
                            displayList += "<option value=\"" + row[index].value + "\">" + row[index].value + "</option>";
                        }
                    });
                }

            },
            error: function () {
                alert('fail');
            },
        });

        return displayList;

};

Any help is appreciated.