JSFiddle - React, Tailwind, and code Playground

by albertjan

HTML

<div class="inputDiv"><input type="text" id="input01" value="1" name="input01"/></div>
<div class="inputDiv"><input type="text" id="input02" value="4" name="input01"/></div>
<div class="inputDiv"><input type="text" id="input03" value="2" name="input01"/></div>
<div class="inputDiv"><input type="text" id="input04" value="1" name="input01"/></div>
<div class="inputDiv"><input type="text" id="input05" value="4" name="input01"/></div>

JavaScript

$(".inputDiv input[type=text]").each(function() {
    var qty = $(this).val();
    var currentId = $(this).attr('id');
    alert(qty + " is a Number");
    alert(currentId + " is a ID");
    $(this).replaceWith('<select id="' + currentId + '" name="" class="NewSelect">' +
          '<option value="1">1</option>' +
          '<option value="2">2</option>' +
          '<option value="3">3</option>' +
          '<option value="4">4</option>' +
          '<option value="5">5</option>' +
          '</select>');

  //this qty instead of this.qty
  //search for an option within the current div.
  $("#" + currentId + " option[value=" + qty + "]").attr('selected', 'selected');
});