var namesList = ['johnathan', 'tim', 'greggory', 'ashton', 'elizabeth'];

$(function() {
    for (var i = 0; i < 5; i++) {
        var name = namesList[i];
        $('#names').append('<option>' + name + '</option>');
    }
    var selected_option = $('#names').find('option:selected').val();
    var truncated = truncate(selected_option);
    $('option:selected').text(truncated.new);

    $('#names').change(function(){
       var selected_option = $(this).find('option:selected').val();
       var truncated = truncate(selected_option);
        $('option:selected').text(truncated.new);
    });

});

function truncate(selected_option) {
    var nameLength = selected_option.length
    if (nameLength > 4) {
        selected_option = selected_option.substr(0, 4) + '...';
    }
    return {new: selected_option}
}