Insert values generated by PHP in a Javascript array
<p>I'm trying to make a list where the user can select 5 items. Those items are generated through PHP. When the user clicks on 1 item that item needs to be saved in an Javascript array. Once the user selected 5 items, those needs to be saved into an mysql database.</p>

<p>Atm I can select items, but the array remains empty.</p>

<p>My code:</p>

<pre><code>&lt;script type="text/javascript"&gt;

        var genrearray = new Array(4);
        var i=1; 

        $(document).ready(function kleurveranderen() {
            $(".keuzeDiv").on("click", function kleurveranderen() {
                if(i&lt;=5){   
                        $(this).toggleClass("green");
                        genrearray[i] = document.getElementById("$Keuzescherm['Genrenaam']").innerHTML;
                        i++;

            }
        else{
                alert("Teveel genres geselecteerd.");
            }

        })
        });&lt;/script&gt; 
</code></pre>

<p>this is standing between script tags but for some reason he isnt showing them. </p>

<p>my php code: </p>

<pre><code>&lt;?php while($Keuzescherm= $allGenres-&gt;fetch_assoc())
{
       echo "&lt;div class='keuzeDiv' id='".$Keuzescherm['Genrenaam'] ."'&gt;" 
              . $Keuzescherm['Genrenaam']."&lt;/div&gt;"; 
    }?&gt;
</code></pre>

<p>the id of the div is the same as the value.</p>

<p>my css code to indicate that the div is selected</p>

<pre><code>.keuzeDiv{
background-color:#dddddd; 
padding-top:5%;
color: black;
padding-bottom: 10px;
 }
.green{
    background-color:#8eb461; 
    color:white;}   
</code></pre>

<p>So my question is: <strong>How can I fill the array with the php values and save that array to a MySql database?</strong></p>
