how to connect html button to javascript function?
<p>i recently started to do web programming.
i got a task that using javascript. </p>

<p>what i'm trying to do is that i type some text in texture and if i press a button, it makes text size changed 
so </p>

<p>1) type text in textarea         </p>

<p>2) press a button</p>

<p>3) a button calls javascript function from javascript file</p>

<p>4) function changes text size and returns it to somewhere(?)</p>

<p>5) size-changed text is displayed in texture</p>

<p>i think i did 1~3 but not 100% sure </p>

<p>this is my code :</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>function doFunction() {
     var txt = document.getElementById("txt").value;
     var result = txt.fontsize(24); 
    }</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;h1&gt;Pimp My Text&lt;/h1&gt;
        &lt;div&gt;
            &lt;img  src="http://www.cs.washington.edu/education/courses/190m/09sp/labs/5-pimpify/pimpin.jpg" alt="Marty Stepp, pimpin' it!" /&gt;
        &lt;/div&gt;
        &lt;fieldset&gt;
            &lt;legend&gt;Text&lt;/legend&gt;
            &lt;textarea rows ="3" cols= "30" id="txt"&gt;
            &lt;/textarea&gt;
            
        &lt;/fieldset&gt;
        &lt;fieldset&gt;
            &lt;legend&gt;Pimpification&lt;/legend&gt;
            &lt;input type="button" value="Bigger pimpin!"  onclick="doFunction();"/
    &lt;/br&gt;
            &lt;input type="checkbox" name="Bling" /&gt;Bling
        &lt;/fieldset&gt;</code></pre>
</div>
</div>
</p>