title: Jquery not firing onchange with bootstrap 4
body: <p>I have code which works:</p>
  
  <pre><code>&lt;div id="type" class="btn-group" data-toggle="buttons"&gt;
      &lt;label class="btn btn-outline-primary" id="type0"&gt;
          &lt;input id="type0" name="op" type="radio" value="0" /&gt;Wholesale&lt;/label&gt;
      &lt;label class="btn btn-outline-primary" id="type1"&gt;
          &lt;input id="type1" name="op" type="radio" value="1" /&gt;Retail&lt;/label&gt;
  &lt;/div&gt;
  
  &lt;script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.12.4.min.js"&gt;&lt;/script&gt;
  &lt;script&gt;
  jQuery(function ($) {
      $(document).on('change', 'input:radio[id^="type"]', function (event) {
          alert("click fired");
      });
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>This can be seen at <a href="http://118.127.41.41/~emmarkho1/calculator/test.html" rel="nofollow">http://118.127.41.41/~emmarkho1/calculator/test.html</a></p>
  
  <p>I have integrated this code into my calculator I'm building but it refuses to fire on change.</p>
  
  <p>Full source can be seen @ <a href="http://118.127.41.41/~emmarkho1/calculator/" rel="nofollow">http://118.127.41.41/~emmarkho1/calculator/</a></p>
  
  <p>Any assistance would be greatly appreciated.</p>