PHP/AJAX : Can't display foreign character in ajax response

Question

In my database i have special characters of foreign country names. I used <meta charset="utf-8"> in normal input of that special character in html its working properly. However, when I call the ajax request and display that special character into specific div using html(data), text are changing to ????? ??????? ????? ????? ??????? ????? How to resolve this

html

<div id="country_info"> </div>

js

$(document).on('change','#country_list', function(){
     var thisVal_id = $(this).val();
  $.ajax({
    url:'../ajax/paraphernalia/ajax_displayCountry_info.php',
    type:'post',
    data: {thisVal_id : thisVal_id , event_id : event_id},
    cache : false,
    success : function(data){
        $('#country_info').html(data);
    }
 });
});

response.php

//this select option contains different foreign characters
$output .= '<select id="official_name" class="form-control" style="padding:0px; !important">';
        while($row1 = mysql_fetch_assoc($sql1)){
            $output .= '<option value="'.$row1['name_official'].'">'.$row1['name_official'].'</option>';
        }
$output .= '</select>';
echo $output;

Answer 1

Just do a small change this works for me..

$output .= '<select id="official_name" class="form-control" style="padding:0px; !important">';
    while($row1 = mysql_fetch_assoc($sql1)){
$name=mb_convert_encoding($row1['name_official'], 'HTML-ENTITIES', 'utf-8')
        $output .= '<option value="'.$name.'">'.$name.'</option>';
    }
$output .= '</select>';
echo $output;