Create a label and it’s associated element without using ID

I’m gonna create a label element and it’s associated input element together using JavaScript. This can be achieved if I use id and for attributes:

// Create input element:
let newInput = document.createElement('Input');
newInput.setAttribute('type', 'radio');
newInput.setAttribute('value', 'y');
newInput.setAttribute('id', 'myInput2');
newInput.setAttribute('name', 'opt');
document.body.appendChild(newInput);

// Create label for new Input:
let newlabel = document.createElement('Label');
newlabel.setAttribute('for', 'myInput2');
newlabel.textContent = 'Option 2:';
document.body.appendChild(newlabel);
<input type='radio' value='x' id='myInput1' name='opt'>
<label for='myInput1'>Option 1:</label>

The problem is: I have so many forms and so many inputs too, so this solution(which Chooses id for any input) looks like to be a nightmare rather than an option. In other hand, it seems ridiculous to create ID for an element just for binding it to a label (Of course it’s my opinion)!

Fortunately there is an option in HTML to get rid of these kind of IDs:

// I couldn't find any way to create a new label and it's bounded element without using ID!
<label>
Option 1:
<input type='radio' value='x' name='opt'>
</label>

But I couldn’t find it’s JavaScript equivalent:(

So my question is: How can I create a label element in JavaScript and bind it to an input element without specifying ID?

Answer

you should append input to label, like this:

for (const i of [1, 2]) {

  // Create input element:
  let newInput = document.createElement('Input');
  newInput.setAttribute('type', 'radio');
  newInput.setAttribute('value', 'y');
  newInput.setAttribute('name', 'opt');

  // Create label for new Input:
  let newlabel = document.createElement('Label');
  newlabel.textContent = `Option ${i}:`;
  newlabel.appendChild(newInput);
  document.body.appendChild(newlabel);

}