JSFiddle - React, Tailwind, and code Playground

by martinschaer

HTML

<form id="theform" action="#">
    <ul>
    </ul>
</form>

JavaScript

var span = '<span id="valuespan">This is the value of a text box</span><span id="valuespan2">This another text box value</span>';

$('span', $('<div>' + span + '</div>')).each(function(){
    var value = $(this).text();
    var id = $(this).attr('id');
    var field = '<input type="checkbox" name="' + id + '" id="' + id + '" value="' + value + '" />';
    field += '<label for="' + id + '">' + value + '</label>';
    $('#theform ul').append('<li>' + field + '</li>');
});

// just to make sure the value was correctly set when you check the checkbox
$('input[type=checkbox]').change(function(){if(this.checked)alert('value = ' + $(this).val())});