JSFiddle - React, Tailwind, and code Playground

HTML

Firstname : 
<input id="firstname" data-index="5" class="spellchecker" style="display:none; visibility:hidden"></input>
<br />
Lastname : 
<input id="lastname" data-index="6" class="spellchecker" style="display:none; visibility:hidden"></input>

 Reversed -
  <span></span>

  <ul class="jr-mSelectlistSelected">
    <li data-index="3">Three</li>
    <li data-index="4">Four</li>
    <li data-index="5">Five</li>
  </ul>

  <div id="detailBillDetailLayout">
    <div id="detailLayoutIC">
      <div>
        <div>
          <div class="jr-mMultiselect">
            <div class="jr-isActive">
              <div class="jr-mMultiselect-list">
                <div class="jr-mScalablelist">
                  <div>
                    <ul class="jr-mSelectlistSelected">
                      <li data-index="0">Zero</li>
                      <li class="one" data-index="1">One</li>
                      <li data-index="2">Two</li>
                    </ul>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

JavaScript

alert(document.getElementsByClassName("spellchecker").length);

var elements = document.getElementsByClassName('spellchecker');
for(var i = 0; i < elements.length; i++) {
    elements[i].style.visibility = "visible";
    elements[i].style.display = "block";
    elements[i].data-index = "1";
}

function display(divs) {
      var a = [];
      for (var i = 0; i < divs.length; i++) {
        //a.push(divs[i].innerHTML);
        a.push(divs[i].outerHTML + "\r\n  ");
        //divs[i].data-index = "" + i + "";
        console.log(divs[i].class);
      }
      $("span").text(a.join("<br>  "));
    }
    display(jQuery("#detailBillDetailLayout > #detailLayoutIC> div > div > .jr-mMultiselect > .jr-isActive > .jr-mMultiselect-list > .jr-mScalablelist > div >ul >li").get());
    //display($("li").get().reverse());
    //display(jQuery("div#detailBillDetailLayout > .jr-mSelectlistSelected1 > li").get());

    jQuery(document).ready(function () {
      jQuery(".jr-mSelectlistSelected").sortable();
      jQuery(".jr-mSelectlistSelected").disableSelection();
      jQuery(".jr-mSelectlistSelected").on("sortstop", function (event, ui) {
        alert("Sotable Stop Event");
      });
    });