JSFiddle - React, Tailwind, and code Playground

by Zero Fx

HTML

<ul id="un_list">
  <li><a id="ids1" href="#ids1">1</a></li>
  <li><a id="ids12" href="#ids12">2</a></li>
  <li><a id="ids13" href="#ids13">3</a></li>
  <li><a id="ids14" href="#ids14">4</a></li>
  <li><a id="ids15" href="#ids15">5</a></li>
</ul>

<script src="https://code.jquery.com/jquery-1.9.1.js" integrity="sha256-e9gNBsAcA0DBuRWbm0oZfbiCyhjLrI6bmqAl5o+ZjUA=" crossorigin="anonymous"></script>

CSS

#un_list {
  overflow: hidden;
  position: relative;
  list-style: none;
  margin: 25px auto 25px;
  display: table;
}
#un_list li {
  float: left;
  margin-right: 15px;
}
#un_list a {
  text-decoration: none;
  font: 16px 'Arial';
  color: red;
}
#un_list a:hover {
  color: yellow;
}

JavaScript

$(document).ready(function() {

  var bd = $('body');
  var bd_un_link = $('body #un_list a');
  //var lk_un_id = bd.find(bd_un_link).attr('id');

  var ar3 = new Array();
  bd_un_link.each(
    function () {
      ar3.push(this.id)
    }
  );

  console.log(ar3);
});