jquery dynamically add items to li with an onclick function
<p>Mega noob here so excuse me if this is a silly question or if it doesn't make any sense.</p>

<p>I have a li list which I create dynamically from a mySQL database. The code for this looks like this:</p>

<pre><code>var resultCount = 0;
var mxKey = $.now();

$.get("\\php\\phpGenre.php?mxKey"+mxKey, function(genreData){

    jsonResults = JSON.parse(genreData);

    while (resultCount&lt;jsonResults.length){
        var genreName = jsonResults[resultCount]['genre_name'];
            $('#genreList').append('&lt;li&gt;&lt;a href="#" onclick="searchGenres(' + genreName + ');return false"&gt;&lt;span&gt;' + genreName + '&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;');
                resultCount++;
    }

});
</code></pre>

<p>When I create my list I also need to be able to add an onClick event which calls a function... this function uses the list name as a value and is generated via the variable genreName. My list gets created ok but the onClick event doesn't work and keeps returning:</p>

<pre><code>SCRIPT5009: 'Documentary' is undefined
</code></pre>

<p>or another example would be:</p>

<pre><code>SCRIPT5009: 'Fantasy' is undefined 
</code></pre>

<p>Where 'Documentary' and 'Fantasy' are the genreName.</p>

<p>So my question is how can I include an onClick event to each list item which will use the genreName as the value?</p>

<p>If I hard code the list it works fine:</p>

<pre><code>&lt;ul&gt;&lt;li&gt;&lt;a href="#" onclick="searchGenres('action');return false"&gt;&lt;span&gt;Still To Do...&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;
</code></pre>

<p>Thanks.... sorry once again for my poor coding knowledge.</p>
