Автоматического обновление выпадающего после отправки нового значения

Question

у меня есть выпадающий список с этим кодом:

и другим блоком:

<script type="text/javascript"> 
    /*Primo pulsante attributo*/ 

    $(document).ready(function() { 
     $('#bloccoetapulsante').click(function() { 

      var dati = $("#campo").val(); 

      $.ajax({ 
       url: "database/bloccoattributi.php", 
       data: 'dati=' + dati, 
       method: "POST", 
       dataType: "HTML", 
       cache: false, 
       success: function(data) { 
        alert("Attributo inserito"); 

       } 
      }); 
     }); 
    }); 
</script> 

<div class="row"> 
    <div class="col-lg-3"> 
     <div class="input-group"> 
      <input name="campo" id="campo" type="text" class="form-control" placeholder="Inserisci altro"> 
      <span class="input-group-btn"> 
     <button class="btn btn-default" type="button" id="bloccoetapulsante"><span class="glyphicon glyphicon-plus"></span></button> 
      </span> 
     </div> 
     <!-- /input-group --> 

Как я могу обновить ниспадающее меню, без перезагрузки страницы, после того, как добавить новое значение с помощью кнопки (bloccoetapulsante)?

Благодаря

Answer 1

success: function (data) { 
    $("#id").html("Attributo inserito"); // #id as a dropdown Id 
} 

или

$("#id").append("Attributo inserito"); 

Answer 2

Просто добавьте $('.selectpicker').selectpicker('refresh'); после Ajax вызова. он освежит Bootstrap selectbox