ajax response good, but dont get into the select on HTML

Question

So, I have an ajax call for getting some JSON response. I receive it well,but its inside a select to show on html and show it empty.

The js code is here:

 //INICIO FUNCION CARGAREDITORESCREAR
       function cargarEditoresCrear() {
           $.ajax({
               type: 'POST',
               dataType: 'json',
               url: 'php/listar_editores.php',
               async: false,

               error: function(xhr, status, error) {


               },
               success: function(data) {
                   $('#editores2').empty();
                   $.each(data, function() {
                       $('#editores2').append(
                           $('<option > </option>').val(this.id_editor).html(this.persona_contacto)
                       );
                   });

               },
               complete: {

               }
           });
       }
       //FIN FUNCION CARGAREDITORESCREAR

the php code is this one:

<?php
header('Access-Control-Allow-Origin: *');
/* Database connection information */
include("mysql.php" );
/*
 * Local functions
 */
function fatal_error($sErrorMessage = '') {
    header($_SERVER['SERVER_PROTOCOL'] . ' 500 Internal Server Error');
    die($sErrorMessage);
}
/*
 * MySQL connection
 */
if (!$gaSql['link'] = mysql_pconnect($gaSql['server'], $gaSql['user'], $gaSql['password'])) {
    fatal_error('Could not open connection to server');
}
if (!mysql_select_db($gaSql['db'], $gaSql['link'])) {
    fatal_error('Could not select database ');
}
mysql_query('SET names utf8');
/*
 * SQL queries
 * Get data to display
 */
$sQuery = "select id_editor, persona_contacto from editor order by persona_contacto";
$rResult = mysql_query($sQuery, $gaSql['link']) or fatal_error('MySQL Error: ' . mysql_errno());
$resultado = array();
while ($fila = mysql_fetch_array($rResult)) {
    $resultado[] = array(
      'id_editor' => $fila['id_editor'],
      'persona_contacto' => $fila['persona_contacto']
   );
}
echo json_encode($resultado);
?>

And the server response is OK, so there is:

[{"id_editor":"1","persona_contacto":"juako"},{"id_editor":"2","persona_contacto":"pepe"}]

And the HTML were it might be inserted is this one:

<div class="form-group">
                            <label for="editores2" class="col-sm-2 control-label">Nombre Editores*:</label>
                            <div class="col-sm-10">
                                <select  multiple id="editores2" name="editores2" >

                                </select>
                            </div>
                        </div>

I'm getting desperate, cause it works fine yesterday, and suddenly it stop working

Thank you all!

Edit: Here I load the function

 $('#creaDoc').click(function(e) {
           e.preventDefault();

           //oculto tabla muestro form
          $('#tabla').fadeOut(100);
          $('#formularioCrear').fadeIn(100);
          cargarEditoresCrear();
          cargarMediosCrear();
          cargarClientesCrear();

       });

Answer 1

Try this:

$.each(data, function(id_editor, persona_contacto) {
    $('#editores2').append(
      $('<option > </option>').val(id_editor).html(persona_contacto)
    );
});

Suerte!

Answer 2

function cargarEditoresCrear() {
           $.ajax({
               type: 'POST',
               dataType: 'json',
               url: 'php/listar_editores.php',
               async: false,

               error: function(xhr, status, error) {


               },
               success: function(data) {
                   $('#editores2').empty();
                   $.each(data, function() {
                       $('#editores2').append('<option value="'+data["id_editor"]+'" >'+data["persona_contacto"]+'</option>') 
                  });

               },
               complete: {

               }
           });
       }
       //FIN FUNCION CARGAREDITORESCREAR