JSFiddle - React, Tailwind, and code Playground

by nogoodatcoding

HTML

<a href="http://stackoverflow.com/questions/5341698/label-which-once-clicked-changes-to-optionbox">fiddle for http://stackoverflow.com/questions/5341698/label-which-once-clicked-changes-to-optionbox</a>.
<br/>
<br/><strong>Click the first column of the table.</strong>
<br/>
<table>
    <tr>
        <td><span id="label1">Label</span>
            <select id="selector" style="display:none"><option id="option1" value="option1">option1</option><option id="option2" value="option2">option2</option></select>
    </td>
    <td>Content</td></tr>
</table>

CSS

table td {
    border: 1px dotted #666;
    border-collapse: collapse;
    padding: 2px;
}

JavaScript

$('#label1').click(function(){
    $(this).hide();
    $('#selector').show();
});


$('#selector').bind('change', function(){
    $('#label1').text($("#selector option:selected").val());
    $(this).hide();
    $('#label1').show();
});