Dynamic HTML5 Datalist

Question

So habe ich ein kleines Problem damit, meinen HTML5 Datalist dynamisch aus einem Javascripi-Array zu befüllen, das aus Werten eines Schlüssels eines Objekts gefüllt wird, das über Zeilen in einer MySQL-Datenbank gefüllt wird. Puh!

MySQL Datenbank => Tabelle => Zeilen => JSON => Javascript Objekte => "Vorname" & "Nachname" Schlüssel => Array der Vornamen => Datalist Optionen.

Ich habe erfolgreich das Array von Namen:

var nameArray = ["Rick Bross","Madison Smith","Jack Johnson"]; //Example of my array 

Und eine Schleife einrichten sie auf die Datenliste .append:

for (var i = 0; i < nameArray.length; i++) { 
    alert(i + " - " + nameArray[i]); //Works Fine, "0 - Rick Bross", "1 - Madison Smith", etc. 
    $('#potentials').append("<option value='" + nameArray[i] + ">"); // Not working. 
} 

Hier ist mein HTML:

<input tabindex='1' list="potentials" type="text" placeholder="First &amp; Last Name" id="name" name="name"></input> 
<datalist id="potentials"> 
</datalist> 

Weiß jemand, warum dies nicht bevölkert ist?

Answer 1

Es gibt eine fehlende Apostroph, versuchen:

$('#potentials').append("<option value='" + nameArray[i] + "'>"); 

Answer 2

$ ("Datalist # Potential) Versuchen .append ...