.on() doesn't work properly with dynamic content : <p>I have a simple js script which gets backgrounds of the following elements:
    <div class="snippet" data-lang="js" data-hide="false" data-console="true">
<div class="snippet-code">
<pre class="snippet-code-html lang-html prettyprint-override"><code>    &lt;ul class="vk_image_grid"&gt;
    		&lt;li style="background-image: url(https://name.com/image1.jpg)" class="block"&gt;
    		&lt;/li&gt;
    		&lt;li style="background-image: url(https://name.com/image2.jpg)" class="block"&gt;
    		&lt;/li&gt;
    		&lt;li style="background-image: url(https://name.com/image3.jpg)" class="block"&gt;
    		&lt;/li&gt;
    	&lt;/ul&gt;
&lt;script&gt;
	$("ul li").on( "click", function() {
		var bg = $(this).css('background-image');
		alert(bg);
&lt;/script&gt;</code></pre>
</div>
</div>
</p>

<p>It works perfectly with the first two <code>li</code> which are generated by php. But it doesn't show the background of the third <code>li</code> which is generateed by another jQuery script. How can I fix the issue?</p>
