JSFiddle - React, Tailwind, and code Playground

by Megi93

HTML

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.13/css/all.css">
<h3>Recent</h3>
<ul class="list">
   <li>Dunja Maksimovic <span class="lastSeen">Yesterday</span></li>
   <li>Jelena Dunja Dunjic <span class="lastSeen">Yesterday</span></li>
   <li>Aleksandar Radovic <span class="lastSeen">Yesterday</span></li>
   <li>Mihailo Babic <span class="lastSeen">Yesterday</span></li>
   <li>Milica Azanjac <span class="lastSeen">Yesterday</span></li>
   <li>Djurdjica Marinovic <span class="lastSeen">Yesterday</span></li>
</ul>

CSS

ul.list {
   list-style-type: none;
   padding: 0;
}

span.lastSeen {
   float: right;
   font-size: 12px;
}

.js-close {
   position: absolute;
   right: 0;
   top: 0;
   padding: 10px;
}

.js-close:hover {
   color: #ffffff;
}

.js-hide {
   display: none;
}

JavaScript

var ul = document.querySelector('.list');
var listItem = document.getElementsByTagName("LI");


if (listItem) {

	document.getElementsByClassName('lastSeen').classList.add('js-icon');
   return
}