JSFiddle - React, Tailwind, and code Playground

HTML

<div>
  <button id="setRight">Step 1: Set rightChoice id</button>
</div>
<div>
  <button class="display">Step 2: Display in console updated rightChoice id</button>
</div>
<div>
  <button id="flip">Step 3: Flip Me</button>
</div>
<div>
  <button class="display">Step 4: Display in console lightChoice id is same as right id</button>
</div>
<div>
  <button id="setLeft">Step 5: Set leftChoice id</button>
</div>
<div>
  <button class="display">Step 6: Display update leftChoice id)</button>
</div>

JavaScript

right = 'right';
left = 'left';
currentChoice = right;
leftChoiceExists = false;

function Unique() {
	this.id = 'no-current-id';
}
var rightChoice = new Unique();
var leftChoice = new Unique();

$('#setRight').click(function () {
	rightChoice.id = '999';
});

$('#setLeft').click(function () {
	leftChoice.id = '444';
});

$('.display').click(function () {
	if (currentChoice === right) {
  	console.log('rightChoice.id = ' + rightChoice.id);
  }
  else if (currentChoice === left) {
  	console.log('leftChoice.id = ' + leftChoice.id);
  }
  else {
  	console.log('display error');
  }
});

$('#flip').click(function () {
    if (currentChoice === right) {
        if (!leftChoiceExists) {
            leftChoice = rightChoice;
            leftChoiceExists = true;
            console.log('leftChoice has now copied value of rightChoice');
        }
        currentChoice = left;
    }
    else if (currentChoice === left) {
        currentChoice = right;
    }
    else {
        console.log('flip failed');
    }

    console.log("right: " + rightChoice.id);
    console.log("left: " + leftChoice.id);
});