My generated link in the unordered list is not navigable

let x=[];
let array = []
const json1 = '{"https://www.w3schools.com/html/":"check w3 schools"}';
const obj1 = JSON.parse(json1);
array=Object.getOwnPropertyNames(obj1);
    ul = document.createElement('ul');
            ser.appendChild(ul);
                    x= document.createElement('li');
                    x.innerText="<a href="" + array[0]+ "">"+"</a>";//hyper link not clickable
                    ul.appendChild(x);

<div id="ser"></div>

the javascript code renders the unordered list but the link in the list() is not navigable.Please advice on solving this issue.

Answer

There are multiple fixes so take a look at this

let array = []
const json1 = '{"https://www.w3schools.com/html/":"check w3 schools"}';
const obj1 = JSON.parse(json1);
array = Object.getOwnPropertyNames(obj1);
const ul = document.querySelector('#ser').appendChild(document.createElement('ul'));
const x = document.createElement('li');
const a = document.createElement('a');
a.setAttribute("href", array[0]);
a.innerHTML = array[0];
x.appendChild(a);
ul.appendChild(x);