Sorry. Javascript (using jquery) noob here. Here is the question.

I have a select field with numbers:

```
<div class="controls">
  <select class="span2" id='select1' onchange="addstuff()">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
  </select>
</div>
<div id="addfields"></div>

```

I then loop through the number specified, and add some html within the div tag that has the
id of "select1".

```
function addstuff()
{
  var num = parseInt($('#select1').val())
  if (num != 0)
  {
    for (i=0; i<num;i++)
      {
        new_field += "<p>" + num + "</p>";
      }
  $('#addfields').html(new_field);
  }
}

```

So if I select the option of 3, the following html will be added:

```
<p> + num + </p>
<p> + num + </p>
<p> + num + </p>

```

However, if I select 2, 2 more fields will be appended:

```
<p> + num + </p>
<p> + num + </p>
<p> + num + </p>
<p> + num + </p>
<p> + num + </p>

```

However, I want the previous html to be scrubbed, and I only want two entries. 

```
<p> + num + </p>
<p> + num + </p>

```

If someone could please help me see what I am missing, it would be much appreciated. Thank you!