My generated link in the unordered list is not navigable-CodePudding

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.

CodePudding user response：

You must use .innerHTML instead of .innerText. Also, make sure to put text inside the and tags, or else the link won't be visible.

CodePudding user response：

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);