How do i get **each()** input value inside a div into the innerHTML of **each()** div onClick? I want to use each() or something similar because i need to scale this up to multiple tabs and rows, this is what i have so far.

Event trigger:

```
<input type='radio' name='tab' id='tab1'>
<label for='tab1'>Tab 1</label>

```

Input:

```
<div class='row' id='tab1-container'>
    <div class='cell'>
        <input type='text'>
    </div>
    <div class='cell'>
        <input type='text'>
    </div>
    <div class='cell'>
        <input type='date'>
    </div>
</div>

```

Output:

```
<div class='row' id='preview1'>
    <div class='cell'></div>
    <div class='cell'></div>
    <div class='cell'></div>
</div>

```

JQuery:

```
$(document).on("click", "#tab1", function () {
    $(function () {
        $('#tab1-container .cell input').each(function () {
            input = $(this).val();
            $('#preview1 .cell').html(input);
        });
    });
});

```

Learning JQuery, what am i doing wrong here?
see my jsfiddle: <http://jsfiddle.net/GSnqR/7/>

**Solution** 
I went for (courtesy of Jackson but without the find() function), this allows me to get **all** the inputs and dump them on to a preview tab:

```
$(document).on('click', '.tab', function () {
    var inputs = $('.tab-container .cell input');
    var outputs = $('.preview .cell');
    for (var i = 0; i < inputs.length; i += 1) {
        var value = $(inputs[i]).val();
        $(outputs[i]).html(value);
    }
});

```