Display file list with Arial font

HTML

<div>
  <li>
    <ul class="item" data-val="item-1">File 1</ul>
    <ul class="item" data-val="item-2">File 2</ul>
  </li>
</div>

CSS

ul.item {
  font-size: 14px;
  font-family: Arial, sans-serif;
  font-weight: 600;
  letter-spacing: 1px;
  padding: 4px 8px;
  border: 2px solid green;
  background-color: white;
  border-radius: 8px;
  width:fit-content;
}

JavaScript

document.addEventListener('click', function (event) { // Listen to any clicks
    const item = event.target.closest('.item');
    if (item) {
      const currentContent = item.innerHTML;      //Get what's currently displayed
      const currentDataValue = item.dataset.val;  //Get what's currently stored
      item.innerHTML = currentDataValue;          //Display what's currently stored
      item.dataset.val = currentContent;          //Store what's currently displayed
    } else {
      return;
    }
});