Javascript Radio buttons issue

I have two radio buttons - 'Italian' & 'Spanish'. When one is selected, I wont the autocomplete for 'Main' and 'Starter' inputs to be populated from different files. So when 'Spanish' is checked, it does autocomplete from http://xxx/spanish.php, and when 'Italian' is check, it does it from http://xxx/italian.php.

var radio1 = document.getElementById("radio1");
var radio3 = document.getElementById("radio3");

if (radio1.checked){
    alert("radio1 selected");


        //Starter Autocomplete  (Spanish)         
        var starterSearchData;
        $(function() {
            $.ajax({
                url: "http://ift.tt/2hU3guN",
                dataType: "jsonp",
                async: false,
                success: function(data) {
                    starterSearchData = $.map(data, function(item) {
                        if (item.course == "starter")
                            return item.name;
                    });
                    EnableAutoComplete();
                },
                error: function(xhr, status, error) {
                    var err = eval("(" + xhr.responseText + ")");
                    alert(err.Message);
                }
            });

            function EnableAutoComplete() {
                $("#starter").autocomplete({
                    source: starterSearchData,
                    minLength: 2,
                    delay: 010
                });
            }
        });

        //Main Autocomplete   (Spanish)          
        var mainSearchData;
        $(function() {
            $.ajax({
                url: "http://ift.tt/2hU3guN",
                dataType: "jsonp",
                async: false,
                success: function(data) {
                    mainSearchData = $.map(data, function(item) {
                        if (item.course == "main")
                            return item.name;
                    });
                    EnableAutoComplete();
                },
                error: function(xhr, status, error) {
                    var err = eval("(" + xhr.responseText + ")");
                    alert(err.Message);
                }
            });

            function EnableAutoComplete() {
                $("#main").autocomplete({
                    source: mainSearchData,
                    minLength: 2,
                    delay: 010
                });
            }
        });

}else if (radio3.checked) { .... same code, except url changed to http://xxx/italian.php... }

HTML:

<div id="radio">
    <input type="radio" id="radio1" name="radio"><label for="radio1">Spanish</label>
    <input type="radio" id="radio3" name="radio"><label for="radio3">Italian</label>
</div>
<label for="starter">Choose starter</label>
<input type="text" name="starter" id="starter"><br>
<label for="main">Choose main</label>
<input type="text" name="main" id="main"><br>

The ajax call, etc, works, but when i try the if statement, the fields do not populate/autocomplete.

Thanks.