title: Removing and Reapplying Widget on an Element
body: <p>I have got a problem. I am applying the widget on  <code>select</code> element. When I am reloading the same <code>select</code> element values, I am removing the widget on the <code>select</code> element and reapplying. But while reapplying the widget on the same element, the changes are not reflecting.</p>
  
  <p>Below is the HTML select statement:</p>
  
  <pre><code>&lt;select id="countries" class="multiselect" multiple="multiple" name="countries"&gt;
          &lt;option value="USA"&gt;United States&lt;/option&gt;
          ...
  &lt;/select&gt;
  </code></pre>
  
  <p>To apply the widget on the same element:</p>
  
  <pre><code>function applyWidget(){ 
      $(".multiselect").multiselect();
  }
  </code></pre>
  
  <p>Once the widget is applied, it is creating a <code>div</code> with <code>class=".ui-multiselect"</code>. </p>
  
  <p>To remove the widget class:</p>
  
  <pre><code>function removeWidget(){
      $(".ui-multiselect").remove();
  }
  </code></pre>
  
  <p>Calling the <code>applyWidget()</code> method for the first time is working fine. Calling the second time is not working.  How do I reload the widget on the element?</p>