JSFiddle - React, Tailwind, and code Playground

by fresheyeball

HTML

<input type="hidden" name="sizes[0][id]" value="0" class="sizes">
<input type="hidden" name="sizes[0][name]" value="Small" class="sizes">
<input type="hidden" name="sizes[1][id]" value="1" class="sizes">
<input type="hidden" name="sizes[1][name]" value="Medium" class="sizes">
<input type="hidden" name="sizes[2][id]" value="2" class="sizes">
<input type="hidden" name="sizes[2][name]" value="Large" class="sizes">
    
    <div id="result"></div>

JavaScript

var sizes = $('input.sizes').map(function(){ 
    return { id   : this.id,
             name : this.name,
             val  : $(this).val()
            }; 
}).get();

$('#result').html(JSON.stringify(sizes));