title: Bootstrap-Jquery multiselect dropdown is not showing the datalist
body: <p>I want to populate a multiselect dropdown with the help of bootstrap-multiselect.js package. I am getting the data is shown in the inspect but dropdown is not showing any data in UI. I used these two packages istead of bootstrap-multiselect also but same result:</p>
  
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;head&gt;
      &lt;title&gt;&lt;/title&gt;
      &lt;link href="Content/bootstrap.min.css" rel="stylesheet" /&gt;
      &lt;link href="Content/bootstrap-multiselect.css" rel="stylesheet" /&gt;
      &lt;script src="Scripts/jquery-3.4.1.js"&gt;&lt;/script&gt;
      &lt;script src="Scripts/jquery-3.4.1.min.js"&gt;&lt;/script&gt;
      &lt;script src="Scripts/bootstrap-multiselect.js"&gt;&lt;/script&gt;
      &lt;link href="Content/bootstrap-theme.css" rel="stylesheet" /&gt;
      &lt;style&gt;
          .multiselect {
              width: 90% !important;
              height: 25px !important;
              padding-top: 1px !important;
          }
  
          ul.multiselect-container.dropdown-menu {
              width: 90% !important;
          }
      &lt;/style&gt;
      &lt;script&gt;
          $(document).ready(function () {
              GetDropDown();
          });
  
          function GetDropDown() {
              var s = '&lt;select id="ddl" style="width:100px;"&gt;&lt;/select&gt;';
              $('#trbody').append(s);
              bindDrpDwn();
          }
  
          function bindDrpDwn() {
              $('#ddl').append($("&lt;option&gt;&lt;/option&gt;").val(0).html('--Select--'));
              for (var j = 0; j &lt; 5; j++) {
                  $('#ddl').append($('&lt;option&gt;&lt;/option&gt;').val(j).html('Test_' + j));
              }
              $('#ddl').attr('multiple', 'multiple');
              $('#ddl').multiselect
                  ({
                      search: true,
                  });
              $('#ddl').multiselect('deselect', '0');
              $('#ddl option').each(function () {
                  $(this).prop('selected', false);
              });
          }
      &lt;/script&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
      &lt;form id="form1" runat="server"&gt;
          &lt;div&gt;
              &lt;table&gt;
                  &lt;thead&gt;
                      &lt;tr&gt;
                          &lt;th&gt;DropDown1&lt;/th&gt;
                      &lt;/tr&gt;
                  &lt;/thead&gt;
                  &lt;tbody&gt;
                      &lt;tr id="trbody"&gt;
                      &lt;/tr&gt;
                  &lt;/tbody&gt;
              &lt;/table&gt;
          &lt;/div&gt;
      &lt;/form&gt;
  &lt;/body&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>This is what I am getting when I am inspecting:
  But in UI dropdown is not showing any data.<br />
  <strong>Image-1</strong><br />
  <img src="https://i.stack.imgur.com/Gsv6C.png" alt="enter image description here" /></p>
  <p><strong>Image-2</strong><br />
  <img src="https://i.stack.imgur.com/s5gz8.png" alt="enter image description here" /></p>
  <p>Please help me with this issue.
  Thank You in advance.</p>