How to show image on hover over org chart

I am writing below code to create org chart using Jquery plugin reference as below

https://www.jqueryscript.net/demo/Fully-Customizable-Organisational-Chart-Plugin-With-jQuery-OrgChart/

It shows image on hover on different nodes like below

I referred this plugin and written code to create org chart which pick Sharepoint source and create org chart hierarchy nodes like below

Org chart is working as expected and content as well coming what am not getting is image on hover below is my full code

<link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css'/>
<link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/orgchart/2.1.9/css/jquery.orgchart.min.css'/> 
<style>

.orgchart {
    box-sizing: border-box!important;
    display: inline-block!important;
    min-height: 202px!important;
    min-width: 202px!important;
    -webkit-touch-callout: none!important;
    -webkit-user-select: none!important;
    -khtml-user-select: none!important;
    -moz-user-select: none!important;
    -ms-user-select: none!important;
    user-select: none!important;
    background-image: none !important;
    background-size: 10px 10px!important;
    border: 1px dashed transparent;
    padding: 20px!important;
}

.orgchart .lines .leftLine {
    border-left: 1px solid #eb3c96!important;
    float: none!important;
    border-radius: 0!important;
}

.orgchart .lines .topLine {
    border-top: 2px solid #eb3c96!important;
}

.orgchart .node .title {
    box-sizing: border-box!important;
    padding: 2px!important;
    width: 130px!important;
    text-align: center!important;
    font-size: .75rem!important;
    font-weight: 700!important;
    height: 20px!important;
    overflow: hidden!important;
    text-overflow: ellipsis!important;
    white-space: nowrap!important;
    background-color: #eb3c96!important;
    color: #fff!important;
    border-radius: 4px 4px 0 0!important;
}


.orgchart .lines .downLine {
    background-color: #eb3c96!important;
    margin: 0 auto!important;
    height: 20px!important;
    width: 2px!important;
    float: none!important;
}

</style>
<div id="chart-container"></div>
<script src='https://code.jquery.com/jquery-1.12.4.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/orgchart/2.1.9/js/jquery.orgchart.min.js'></script>
<script type="text/javascript">
function Employee (ID,Name,Manager,Designation,Email) {
    this.ID = ID;
    this.Name= Name;
    this.Manager = Manager;
    this.Designation = Designation;
    this.Email=Email;
}
function GetOrgJSON(employeeList,manager){
    var note = '';
    var employeeProcessed=[];
    for(var i=0;i<employeeList.length;i++){
        var objEmp = employeeList[i];      
        if(objEmp.Manager == manager && employeeProcessed.indexOf(objEmp.Name) < 0 ){
            note += '{"name":"'+objEmp.Name+'",';
            note += '"title":"'+objEmp.Designation+'"';
        
            employeeProcessed.push(objEmp.Name);
            var empUl = GetOrgJSON(employeeList,objEmp.ID);
            if(empUl !=""){
                note +=',"children": [' + empUl + ']';
            }
            note +='},';
        }       
    } 
    return note;
}
(function($){
  $(function() {
    $.ajax({
        url: "https://XXXXXXX/sites/YYYYYYY/_api/web/lists(guid'XXXXXXXXXXXXXXXXXXXXXXXXXXX')/items?$select=ID,Title,Member/ID,Member/EMail,Member/Title,Manager/ID,Manager/Title,Title&$expand=Manager/Id,Member/Id &$top=1000",
        type: "GET",
        headers: {
            "Accept": "application/json;odata=verbose",
        },
        success: function (data) {
            if(data.d.results.length>0){
                var employeeList = [];
                $.each(data.d.results,function(i,employee){
                var Email=employee.Member.EMail;
                    var title = employee.Member.Title;
                    var ID = employee.Member.ID;
                    var manager = employee.Manager.ID!= undefined ? employee.Manager.ID:"0";
                    //var manager = employee.Manager.ID ? employee.Manager.ID : "0";
                    var designation=employee.designation;
                    var objEmp = new Employee(ID,title ,manager,designation,Email);
                    employeeList.push(objEmp);
                });
                var datascource = GetOrgJSON(employeeList,"0").replace(/},]/g,"}]");
                datascource=datascource.slice(0, datascource.length-1);
                
                //$('#chart-container').orgchart({
                //  'data' : JSON.parse(datascource),
                // 'nodeContent': 'title'
                //});
                

                 $('#chart-container').orgchart({
                 'data' : JSON.parse(datascource),
                 'depth': 2,
                 'nodeTitle': 'name',
                 'nodeContent': 'title',
                 'nodeID': 'id',
                 'createNode': function($node, data) {
                 var nodePrompt = $('<i>', {
                 'class': 'fa fa-info-circle second-menu-icon',
                  click: function() {
                $(this).siblings('.second-menu').toggle();
          }
        });
        var secondMenu = '<div class="second-menu"><img class="avatar" src="img/avatar/' + data.id + '.jpg"></div>';
        $node.append(nodePrompt).append(secondMenu);
      }
    });             
                 
                 

                
            }
        },
        error: function (data) {
            //alert("Error");
        }
    });  
  });
})(jQuery);