Unexpected token while using jquery on event
<p>I'm trying to bind on to a click event for a class but continue to get this error:</p>

<pre><code>Uncaught SyntaxError: Unexpected token ; 
</code></pre>

<p>My jquery and HTML</p>

<pre><code>function loadData() {

  isLoading = true;
  $('#loaderCircle').show();

  $.post(apiURL, { f: 'gridview', start: pgStart, end: pgEnd, params: $("#search_basic_form_id").serialize() }, function(data){
        if (data.success) {
            // Create HTML for the images.
            var html = '';

            $.each(data.profiles, function() {

                html += '&lt;li&gt;&lt;div class="image-wrapper"&gt;';
                html += '&lt;div class="image-options"&gt;';
                html += '&lt;a href="#" id="imgoption_'+this.user_id+'" class="favoriteButton" title="Add Favorite"&gt;&lt;br&gt;Favorite&lt;/a&gt;';
                html += '&lt;/div&gt;';
                html += '&lt;a href="/view_profile.php?id='+this.user_id+'"&gt;';
                html += '&lt;img src="'+this.file_name+'" width=200px; height="'+this.height+'px" style="border:0;"&gt;';
                html += '&lt;/a&gt;';

                // Image title.
                html += '&lt;p&gt;'+this.name+' '+this.age+'&lt;/p&gt;';
                html += '&lt;p&gt;'+this.city+', '+this.state+'&lt;/p&gt;';
                html += '&lt;/div&gt;';
                html += '&lt;/li&gt;';                    
            });

            // Add image HTML to the page.
            $('#tiles').append(html);

            // Apply layout.
            applyLayout();

            pgStart = data.start;
            pgEnd = data.end;

        }
    }, "json");
};

$(document).ready(function() {

    // Load first data from the API.
    loadData();

    $('.favoriteButton').on('click', function(e) {
        e.preventDefault();

        alert("Favorite Clicked");
    });
...
</code></pre>

<p>Not sure why I'm getting this error but it points to the last semi colon in the jquery call. </p>
