<div class="parent">
  <div>2.10</div>
  <div>1.98</div>
  <div>2.22</div>
  <div>2.01</div>
  <div>1.1</div>
  <div>1.14</div>
  <div>1.53</div>
  <div>3.48</div>
  <div>2</div>
  <div>1.99</div>
</div>
.parent {
  display: flex;
  gap: 10px;
}

.parent div {
  padding: 5px 7px;
  cursor: pointer;
}

.big {
  color: green;
  border: 1px solid green;
}

.small {
  color: blue;
  border: 1px solid blue;
}
let divs = document.querySelectorAll(".parent div");
divs.forEach(function (el) {
  let num = Number(el.textContent);
  el.setAttribute("title", num);
  if (num >= 2) {
    el.classList.add("big");
  } else {
    el.classList.add("small");
  }
});

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.