jQueryMobile uncaught exception when REMOVING checkboxradio

Question

Getting this message:

Error: cannot call methods on checkboxradio prior to initialization; 
attempted to call method 'refresh'

i followed the demo found here: Ugly Mongrel

Here's a snip of my JS:

function(){
  var $pbNum = $('<input checked="checked" id="component-pbnum-'+ _val+ 
        '" name="component-pbnum[]'+
        '" type="checkbox" value="'+ _val+ '" data-mini="true">'+
        '<label for="component-pbnum-'+ _val+ '">'+ _val+ '</label>'),
      $pbNumChk = $($pbNum[0]).on("change", function(ev){
        $pbNum.remove();
        // UNCAUGHT EXCEPTION: "cannot call methods on checkboxradio prior
        // to initialization; attempted to call method 'refresh'"
      });

  $pbnumList.controlgroup("container").append($pbNum);
  $pbNumChk.checkboxradio();
// Have also tried $pbNumChk.checkboxradio().checkboxradio("refresh") 
// as hinted by other answers. No difference.
}

i need to add checkboxradio (checkboxes in this case) dynamically, but provide the ability to remove them when they're click/tapped.

It's actually kinda frustrating how limited jQM seems to be compared to jQUI. No (documented) "destroy" method for these widgets? Anyway...

Checkboxes add to my ControlGroup just fine. When i click to remove them in a full browser, they are removed, but an exception is thrown. Everything i've found so far answers with something similar to this: https://stackoverflow.com/a/15180600/258598

Here's what i looked for: http://goo.gl/mVOdo

i don't get it. Why is JS throwing an error about the widget when i'm removing it - and especially when it WAS initialized when it was inserted?

[EDIT]
Fixed a small typo in the $pbNum HTML string

Answer 1

I went through jQuery Mobile JS file and found out that when change triggers, jQM adds/removes classes to the checkbox and then call refresh method .checkboxradio('refresh') to enhance the markup.

It seems that .remove() occurs before refresh takes place, so if you delay the removal process by 1ms, refresh will before the checkbox is removed.

It's worth mentioning that stopImmediatePropagation() didn't help stopping the error message.

Demo

Code

$(document).on('change', '.ui-checkbox', function () {
 var box = $(this);
 setTimeout(function () {
  box.remove();
   $('#group').controlgroup().trigger('create');
 }, 1);
});