jQuery, script doesn't recognize newly appended elements
<p>I have a short script that styles form radio buttons. Check working example <a href="http://jsfiddle.net/YJRsk/" rel="nofollow">http://jsfiddle.net/YJRsk/</a>. </p>

<p>This works great when radio buttons already exist in DOM. So when page load, they get styled properly. </p>

<p>The problem is when i add radio buttons dynamically by appending them, the script doesn't recognize them since it already ran on page load. So for that reason i get an error Uncaught TypeError: Cannot read property 'style' of null. How can i work around this so that newly appended radios gets automatically styled on the spot without having to save and refresh the page. I tried to running the script after each radio append, but that didn't work. </p>

<pre><code>var item = '&lt;li&gt;&lt;input type="radio" value="'+uniqid()+'" class="styled" name="test"/&gt;&lt;label class="radioButton"&gt;Radio button&lt;/label&gt;&lt;/li&gt;';
$('button').live('click', function() {
    $(item).appendTo('#radio');
})
</code></pre>

<p>Check the jsfiddle example and click the "add radio" button to test.</p>
