Генерация динамического JSTree - JStree отображается только тогда, когда имя базы данных жестко запрограммировано

На моем веб-сайте у меня есть опция выпадающего списка, в которой перечислены базы данных, доступные в MySQL. В каждой базе данных у меня есть таблица с именем tree. Всякий раз, когда опция выбора изменяется на новую базу данных или происходит перезагрузка страницы, я делаю запись имени базы данных в файл php.

Я использую следующие сценарии на своей странице:

<!-- Color CSS Styles  -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://code.jquery.com/jquery-1.12.4.js"></script>

    <script src="https://code.jquery.com/ui/1.10.4/jquery-ui.min.js"></script>
    <script src="http://cdn.jsdelivr.net/jquery.cookie/1.4.0/jquery.cookie.min.js"></script>*/
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>    

    <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/jstree/3.3.5/themes/default/style.min.css" />
    <script src="//cdnjs.cloudflare.com/ajax/libs/jstree/3.3.5/jstree.min.js"></script>
    <link rel="stylesheet" type="text/css" href="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/css/jquery.dataTables.css">
    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css">
    <script type="text/javascript" charset="utf8" src="https://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/jquery.dataTables.min.js"></script>
    <script src="https://use.fontawesome.com/f87c84f770.js"></script>
    <link rel="stylesheet"  href="lightslider.css"/>
    <script src="lightslider.js"></script> 
    <script src="jtree.js"></script>

Код для публикации имени базы данных выглядит следующим образом:

index.php

$.post('autorefreshtree.php', {'folder':wd}, function(data) {
    console.log(data);
  });

autorefreshtree.php

session_start();
include('connect.php');
$database = $_POST['folder'];
//$database="IPL2010";
$connect = mysqli_connect($hostname, $username, $password,$database );
if ($connect->connect_error) {
  die("Connection failed: " . $connect->connect_error);
} else {
    echo "Connection successful";
}

category_tree(0);
function category_tree($catid){
    global $connect;
    $sql = "select * from 'tree' where 'parentid' ='$catid'";
    $result = $connect->query($sql);
    while($row = mysqli_fetch_object($result)):
        $i = 0;
        if ($i == 0) echo '<ul>';
            echo '<li>' . $row->nodename;
            category_tree($row->tree_id);
            echo '</li>';
        $i++;
        if ($i > 0) echo '</ul>';
    endwhile;
    }

mysqli_close($connect);

Когда я запускаю код, я получаю Connection Successful которое регистрируется на консоли, дерево генерируется, а полные параметры ul li вместе с данными печатаются на консоли. Однако фактическая древовидная структура не была видна.

Когда я сделаю следующее изменение в моем autorefreshtree.php:

//$database = $_POST['folder'];
$database="IPL2010";   

hard code имя базы данных, отображается как дерево, так и вывод консоли.

Ниже представлена логика отображения:

$(document).ready(function() {
  var wd = localStorage.getItem('wd');
  $.post('autorefreshtree.php', {'folder':wd}, function(data) {
    console.log(data);
  });
})



//Function to autorefresh tree
 var requestUrl = 'autorefreshtree.php';
    $(document).ready(function(){
        $("#annotateDirectories").jstree({
           'core' : {
                'data' : {
                  'url' : requestUrl,
                }
            },
            "checkbox": {   
                "keep_selected_style" : true,
                'tie_selection' : false,        
                'two_state' : true
            },
            'plugins': ['wholerow','search','contextmenu','checkbox','state','sort']
        });
    });

    (function(){ 
        $.ajax({
          type:'get',
          url:requestUrl,
          datatype:"html",
          success:function(data) {
              $('#annotateDirectories').jstree(true).settings.core.data = data;
              $('#annotateDirectories').jstree(true).load_data('#');
          }
        });
    });


//Function to retain the checked status of tree
var selectedBox = sessionStorage.getItem("annotateDirectories");  
  $('#annotateDirectories').val(selectedBox);
  $('#annotateDirectories').change(function() { 
      var dropval = $(this).val();
      sessionStorage.setItem("annotateDirectories", dropval);
});