using a selection box to change font with jquery

I have 3 text input boxes that i want to allow a user to change the font of, but im not sure how to do this.

This is the code for my preview boxes:

<script type="text/javascript">
$(function()
{
    $(".line1").keyup(function()
    {
    var word=$(this).val();
    $(".line_preview1").html(word);
    return false;
    });
    $(".line2").keyup(function()
    {
    var word=$(this).val();
    $(".line_preview2").html(word);
    return false;
    });
    $(".line3").keyup(function()
    {
    var word=$(this).val();
    $(".line_preview3").html(word);
    return false;
    });
});
</script>


<span class="line_preview1"></span>
<span class="line_preview2"></span>
<span class="line_preview3"></span>
<input type="text" name="line1" class="line1" />
<inpu开发者_Python百科t type="text" name="line2" class="line2" />
<input type="text" name="line3" class="line3" />

If i could choose the font for each line that would be great

edit for context

i would like to have;

<select name=font>
<option>Arial</option>
<option>Verdana</option>
<option>Times New Fubar</option>
</select>

when a new option is chosen, it would update the css of the specific preview element

---

You can change the CSS attributes with .css()

$("a#change_font").click(function(){
  $("div#fontchange").css('font-family', 'Courier, mono');
});

<a href="#" id="change_font">Change it!</a>
<div id="fontchange">Hello World!</div>

There's an article here which describes how to use it with select-values: Getting Select List Values.