Bootstrap Dropdown elements disappear
<p>I am using bootstrap with the dropdown. When I first load the page, all elements appear in the list, but for the second time, there is not any element in the list. When I open the page in incognito tag, elements again appear,</p>

<p>Here are the source codes,</p>

<p>Thanks in advance,</p>

<p>JS;</p>

<pre><code>$.ajax({
    type     : "POST",
    url      : "db/../..",
    dataType : "json"
  })
    .done(function( result ) {
      if ( typeof result.error !== "undefined" ) {
        // Error
        dialog.close();
        alertDialog( "Hata", result.error, BootstrapDialog.TYPE_DANGER );
      } else if ( typeof result.List !== "undefined" &amp;&amp; $.isArray( result.List ) ) {
        // A proper result
        if ( result.FirmList.length &lt; 1 ) {
          // No records found
          dialog.close();
          alertDialog( "Error", "Nothing Found!", BootstrapDialog.TYPE_WARNING );
        } else {
          // Parse details
          var f = result.List;

          for ( var i = 0; i &lt; f.length; i++ ) {
            var op = document.createElement( "option" );
            op.value = f[ i ].Id;
            op.textContent = f[ i ].Name;

            document.getElementById( "List" ).appendChild( op );
          }

          $( "#select" ).chosen();

        }
      } else {
        dialog.close();
        alertDialog( "Error", "No Idea!", BootstrapDialog.TYPE_DANGER );
      }
    })
    .fail(function(a, b, c) {
      dialog.close();
      alertDialog( "Error",
        "Error",
        BootstrapDialog.TYPE_DANGER );
    });
</code></pre>

<p>HTML;</p>

<pre><code>&lt;select class="selectpicker" id="List" multiple data-live-search="true" data-actions-box="true" data-selected-text-format="count&gt;1"&gt;
&lt;/select&gt;
</code></pre>

<p><a href="https://jsfiddle.net/o86yk3z1/" rel="nofollow">Here is a JSFiddle.</a></p>