I understand the basic premise of a for loop with JavaScript, however the use of the `.each` evades me.

```
var col = [1, 2, 3, 4, 5, 6];

for (var i = 0; i < col.length; i++) {
    $('p').html(col[i]);
}

```

Which churns out:

```
<p> 6 </p>
<p> 6 </p>
<p> 6 </p>

```

When I was expecting:

```
<p> 1 </p>
<p> 2 </p>
<p> 3 </p>

```

Why is this not working as expected, and how could it be done with jQuery, rather than pure JavaScript?

<http://jsfiddle.net/rgD92/2/>