Drop-down menu initialization with Chrome

Question

In the 'success' function of an AJAX call I initialize the selected value of a drop-down menu like so:

$('#mdCivilite').val (data[0].civilite);

data being an array.

This works smoothly with Firefox (v. 62.0.3): the drop-down menu displays correctly the text matching the value.

With Chrome (v. 67.0.3396.87), it does not work, i.e. the text displayed is that of the first element of the menu array.

What is it I do wrong?

Edition:

1) The drop-down menu is preloaded with JSON data:

 "FR":
 {
   "1" : "M.",
   "2" : "Mme",
   "3" : "Mlle"
 }

Now,for instance, wether data[0].civilite be 1, 2 or 3, the text displayed will be "M.".

The amazing thing is it has worked satisfactorily with Firefox for years.

2) Looking up for possible explanations I also checked here: Stackoverflow and re-tried for the umpteenth time other ways, e.g.:

$('#mdCivilite').prop('selectedIndex', data[0].civilite);

to no avail.