Fix for jQuery clone

jQuery's clone method doesn't clone changed values for certain input types. This shows how we can modify the DOM elements ahead of time to make sure we capture the updated values.

HTML

<div id="in">
    <ul>
        <li>
            <input type="text" value="Initial value"/>
        </li>
        <li>
        <select>
            <option selected="selected">Initial Selection</option>
            <option>Option 2</option>
            <option>Option 3</option>
        </select>
        </li>
        <li>
            <textarea>Initial value</textarea>
        </li>
    </ul>
</div>
<a href="#">Clone</a>
<div id="out">
</div>

JavaScript

$('a')(function(e) {
    e.preventDefault();
    var scope = $('#in');
    $('textarea', scope)
        .each(function(){
            var t = $(this);
            t.text(t.val());
        });
    $('option:selected', scope).each(function() {
        this.selected = true;
        $(this).attr('selected', 'selected');
    });
    scope.clone().appendTo('#out');
});