title: Bootstrap-select with ajax jquery is not working
body: <p>I'm using <a href="http://silviomoreto.github.io/bootstrap-select/" rel="nofollow">bootstrap-select</a> and everything is working fine,until options of my select tag are filled with data from php file. I have seen each post on this topic, but there is no answer. So here is an example:
  Style:</p>
  
  <pre><code>&lt;link rel="stylesheet" href="dist/css/bootstrap-select.css"&gt;&lt;!-- This is from my path--&gt;
  
  &lt;link rel="stylesheet"href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css"&gt;
  </code></pre>
  
  <p>Html:</p>
  
  <pre><code>&lt;!-- This is working --&gt;
  &lt;div class="players col col-lg-3"&gt;
      &lt;label for='selectPlayer'&gt; Pick the Player: &lt;/label&gt;
      &lt;select class='selectpicker' data-style='btn-info'&gt;
          &lt;optgroup id="opt" label='Players'&gt;
              &lt;option&gt;Ronaldo&lt;/option&gt;
          &lt;/optgroup&gt;
      &lt;/select&gt;
  &lt;/div&gt; &lt;!-- Select Player --&gt;
  
  &lt;!-- This is not working,when using ajax jquery --&gt;
  &lt;label for='selectClub'&gt; Tested ajax jquery : &lt;/label&gt;
  &lt;div id="players1" class="players1" data-container="body"&gt;&lt;/div&gt; &lt;!-- Jquery--&gt;
  </code></pre>
  
  <p>Scripts:
      </p>
  
  <pre><code>&lt;script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"&gt;&lt;/script&gt;
  
  &lt;script src="dist/js/bootstrap-select.js"&gt;&lt;/script&gt; &lt;!-- This is from my path,and must be at the end--&gt;
  
  &lt;script&gt;
  /* ---------- References ---------- */
  // http://stackoverflow.com/questions/15726411/how-to-use-bootstrap-select
  // http://stackoverflow.com/questions/5807565/return-value-from-ajax-call-is-not-shown-in-the-page-source
  $(document).ready(function() {
  $.ajax({
          type:"GET",
          url:'selectPHP.php',
          data:{},
          success: function (response) {
              alert(response);
              $('#players1').html(response);
              console.log((response));
          },
          error: function () {
              $('#players1').html('There was an error!');
          }
      });
  
      $('.selectpicker').selectpicker({
          style: 'btn-primary',
          size: 2
      });
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>php file:</p>
  
  <pre><code>echo "&lt;select class='selectpicker' data-style='btn-primary'&gt;";
  echo "&lt;option&gt; data 1 &lt;/option&gt;";
  echo " &lt;/select&gt;&lt;!-- select --&gt;";
  </code></pre>
  
  <p>I'm receiving the data using ajax,but those data are not shown on the page. 
  For example I used bootstrap-table,and it is working, but not in the case of bootstrap-select.
  Do you have any hints about this topic?</p>
  
  <p>Best regards</p>