title: Bootstrap select not working after Laravel livewire render
body: <p>I have a <a href="https://developer.snapappointments.com/bootstrap-select/" rel="nofollow noreferrer">Bootstrap selectpicker</a> element that works fine on the first render. It's initialized with:</p>
  
  <pre><code>$(document).ready(function () {
      $('select').selectpicker();
  });
  </code></pre>
  
  <p>But after livewire's render function is called the <code>&lt;select&gt;</code> element is not rendered as Bootstrap selectpicker anymore.</p>
  
  <p>Going through both the docs (relevant sections <a href="https://laravel-livewire.com/docs/lifecycle-hooks" rel="nofollow noreferrer">here</a> and <a href="https://developer.snapappointments.com/bootstrap-select/methods/#selectpickerrender" rel="nofollow noreferrer">here</a>), I figured that the code below should fix it:</p>
  
  <pre><code>&lt;script&gt;
      document.addEventListener("livewire:load", function(event) {
          window.livewire.hook('afterDomUpdate', () =&gt; {
              $('select').selectpicker('refresh');
          });
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>But this doesn't work. I've also tried:</p>
  
  <pre><code>$('select').selectpicker();
  </code></pre>
  
  <p>and</p>
  
  <pre><code>$('select').selectpicker('render');
  </code></pre>
  
  <p>both within <code>afterDomUpdate</code>, that doesn't work as well. If I call all these functions from the console the DOM doesn't update the <code>&lt;select&gt;</code> element, so indeed these functions do not seem to work.</p>