When creating an unordered list, each element's text corresponds to a chapter name. I also want to include the description of each chapter as tooltip text. The Javascript code I currently have for generating a list item is:
var list_item = document.createElement('li');
var text_element = document.createTextNode(Object.values(json)[i].name);
list_item.appendChild(text_element);
I am aware that typically, a title attribute displays tooltip text for an element, especially in Chrome. Therefore, I attempted to add the title in the same manner I do for buttons:
var list_item = document.createElement('li');
var text_element = document.createTextNode(Object.values(json)[i].name);
text_element.title = json[i].description;
list_item.appendChild(text_element);
Unfortunately, this approach only results in displaying the text normally in the list, without showing a tooltip when hovering over it. How can I ensure that the description appears as a tooltip?