title: Control group loses control after dynamic add of radio button - jQuery Mobile
body: <p>My control group (jquery mobile 1.4) renders perfectly when dynamically creating the radio group initially, but when I add another radio to it, the buttons are styled, but separated. When I reload the app, they are together again.</p>
  
  <pre><code>function showPlaces() {    
      $('#radio-group').empty();
  
      for(var i = 0; i &lt; connections.length; i++) {
          $('#radio-group').append('&lt;label&gt;&lt;input type="radio" name="places" id="' + i + '" /&gt;' + place + '&lt;/label&gt;');           
      }
  
      $('input[type=radio]').checkboxradio().trigger('create');
      $('#radio-group').controlgroup().trigger('create');
  }
  </code></pre>
  
  <p>// The function is called when app starts, and again after I add another place</p>
  
  <p>Some other things I've tried:</p>
  
  <pre><code>$("#radio-group").controlgroup("refresh");                                          
  $('#radio-group').controlgroup('refresh');
  $("[data-role=controlgroup]").controlgroup("refresh");
  $('input[type=radio]').checkboxradio('refresh');
  </code></pre>
  
  <p>Also tried .controlgroup('container'), before the .append, but get "cannot call methods on controlgroup prior to initialization".</p>
  
  <p>Here's the html:</p>
  
  <pre><code>&lt;form&gt;  
      &lt;fieldset data-role="controlgroup" id="radio-group"&gt;
          &lt;!-- Dynamically injected radio buttons go here --&gt;
      &lt;/fieldset&gt;
  &lt;/form&gt; 
  </code></pre>