JavaScript For loop appending 4 times
<p>I have a JavaScript program that isn't properly functioning. For some reasons before it appends what it is actually getting from the checked radio box it appends three times with noting in the append except the styling. I'm not sure what I'm doing wrong.</p>

<pre><code>$(document).delegate('#add-owner', 'pageinit', function () {
            loadOwners();
            $('#add-owner-save').bind('click', function () {
                var permission = $('#editing-permissions option:selected').text();
                var selection = $("input[type='radio']:checked") || [];
                if (selection.length &gt; 0) {
                    for (var i = 0; i &lt; selection.length; i++) {
                        console.log($('#label-' + selection[i].id).find('.owner-name').text());
                        console.log($("input[type='radio']:checked").val());
                        $('.display-owners').append('&lt;div class="ui-grid-a"&gt;&lt;div class="ui-block-a"&gt;' + $('#label-' + selection[i].id).find('.owner-name').text() + '&lt;/div&gt;&lt;div class="ui-block-b" style="text-align:right"&gt;' + permission + '&lt;/div&gt;&lt;/div&gt;');
                    }
                    $('.display-owners').trigger('create');
                }
                $('.display-owners').show();
                $('#add-owner').dialog('close');
                $('input[name=contribute-radio]').attr('checked', false).checkboxradio("refresh");
                return false;
            });
        });
</code></pre>

<p>I think the problem is that I have multiple radio areas on this page. How do I specify that I just want these radio buttons are the ones I want it to checked?</p>
