jquery issue with on and live
<p>I have the following code:</p>

<pre><code>var $reviewButton = $('span.review_button');

$reviewButton
    .live('click',
        function(){

            $('#add_reviews').show(); 

        }
    )
</code></pre>

<p>Later in the script, I use an AJAX call to load some content and another instance of $('span.review_button') enters the picture. I updated my code above to use '.live' because the click event was not working with the AJAX generated review button. </p>

<p>This code works, as the .live(click //) event works on both the static 'span.review_button' and the AJAX generated 'span.review_button'</p>

<p>I see however that .live is depracated so I have tried to follow the jquery documentations instructions by switching to '.on' but when I switch to the code below, I have the same problem I had before switching to '.live' in which the click function works with the original instance of 'span.review_button' but not on the AJAX generated instance:</p>

<pre><code>var $reviewButton = $('span.review_button');

$reviewButton
    .on('click',
        function(){

            $('#add_reviews').show(); 

        }
    )
</code></pre>

<p>Suggestions?</p>
