adding list in a dynamic navigation bar

i am trying to create a dynamic navbar. and i keep getting an error when i use navbar.innerHTML = <a href= #${sectionID}>${sectionID}</a>;

 let NavBarList = document.getElementById('navbar__list');
    let Section = document.getElementsByTagName('section');

function NavBar(){

    let createDom = document.createDocumentFragment();
    let lists = document.querySelectorAll('.navbar__menu');
    
    for(let i = 0; i < lists.length; i++){
       let sectionID = NavBarList.getAttribute('id');
      
        console.log(sectionID + " lllll");
        let navbar = document.createElement('li');
        //navbar.innerHTML = '<a href= #${sectionID}>${sectionID}</a>';
        //navbar.innerHTML = `<a href= #${sectionID}>${sectionID}</a>`;

        navbar.innerHTML = `<a href= #sectionID>sectionID</a>`;

        console.log(navbar + "klklklklklk");
        createDom.appendChild(navbar);
    }
    NavBarList.appendChild(createDom);

}