Bootstrap Select Picker append add new item if search not exist
<select class = "selectpicker" data-live-search= "true" id= "branch" multiple> < option > B.Tech </ option > < option > M.Tech </ option > < option > Ph.D </ option > </select> jQuery script $( '.selectpicker' ). selectpicker ({ noneResultsText : 'No result found <button class="btn btn-dark" onclick=(add_opt(this))>Add new option</button>' }); function add_opt ( event ){ var value = $(event). parents ( 'div' ). siblings ( '.bs-searchbox' ). find ( 'input' ). val (); $(event). parents ( 'div' ). siblings ( '.selectpicker' ). append ($( "<option></option>" ). text (value)). val (value); $( '.selectpicker' ). selectpicker ( 'refresh' ); }