将select2添加到现有的select下拉选项WordPress中

Question

我有一个庞大的分支名称列表，它们保存在自定义表中到我的wordpress数据库中，现在它们显示在下拉列表中。如何将具有搜索功能的select2应用于我现有的下拉选项。

这是我的输出下拉列表的函数

function xnau_set_branch_name (){

    global $wpdb; // grab the db helper object
    $tablename = $wpdb->prefix."sbl_br_name";
    $rows = $wpdb->get_results("SELECT br_name from $tablename");
    // starts output buffering
    ob_start();

    ?>
    <select name="br_name" id="br_name">    
    <?php
    foreach ($rows as $row) { 
        echo "<option value=''>Select Branch name</option>"; 
        echo "<option value=\"".$row->br_name."\">".$row->br_name."option>"; 
    }
    ?>
    <select>
    <?php     
return ob_get_clean();; 
}

add_shortcode('select_branch', 'xnau_set_branch_name');

我试图实现添加select2的功能

和我的jquery代码

<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/css/select2.min.css" rel="stylesheet" />
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/js/select2.min.js"></script>

jQuery(document).ready(function($) {
    $('#br_name').select2({
      selectOnClose: true
    });
});