JSFiddle - React, Tailwind, and code Playground

by David Thomas

HTML

<ul>
    <li><input type="text" /><input type="checkbox" /></li>
    <li><input type="text" /><input type="checkbox" /></li>
    <li><input type="text" /><input type="checkbox" /></li>
</ul>

JavaScript

var $textInputs = $('input:text');
var prevData, textInputIndex, affectedTextInputIndex, textInputValues = [];

$('input:checkbox').change(
    function(){
        affectedTextInputIndex = $(this).index('input') - 1;
        textInputIndex = $('ul input').eq(affectedTextInputIndex).index('input:text');
        
        if ($(this).is(':checked')) {
            textInputValues[textInputIndex] = $textInputs.eq(textInputIndex).val();
            $textInputs.eq(textInputIndex).val('');
        }
        else {
            $textInputs.eq(textInputIndex).val(textInputValues[textInputIndex]);
        }
    });