Copy input from one place and use it as a variable or in another area using onclick
<p>I'm trying to figure out how to take values from one of these input boxes and duplicate them in another input box. This action would be very useful in another project I'm working on but, I can seem to get it to work. 
What am I doing wrong?</p>

<p><a href="http://jsfiddle.net/qBFAe/" rel="nofollow">http://jsfiddle.net/qBFAe/</a></p>

<p>HTML</p>

<pre><code>Field1: &lt;input type="text" id="field1" /&gt;
&lt;br /&gt;
Field2: &lt;input type="text" id="field2" /&gt;
&lt;br /&gt;&lt;br /&gt;
Click the button to copy the content of Field1 to Field2.
&lt;br /&gt;
&lt;button id="convert"&gt;Copy Text&lt;/button&gt;
</code></pre>

<p>JS</p>

<pre><code>var converter = document.getElementById("convert");
var ff2 = document.getElementById('field2');
var ff1 = document.getElementById('field1');
convert.onclick = fillFun();

function fillFun(){
ff2.value=ff1.value;

}
</code></pre>
