не работает append

<form id="pac_form" action=""><!-- Наша форма с именем, сообщением и кнопкой для отправки -->
<table style="width: 100%;">
    <tr>
        <td height="47">Имя:</td>
        <td>Сообщение:</td>
        <td></td>
    </tr>
    <tr>
        <!-- Поле ввода имени -->
        <!--<td><input type="text" id="pac_name" class="r4" value="Гость"></td>-->
    <td><label id="pac_name" class="r4" ><?php echo $login; ?></label> </td>
        <!-- Поле ввода сообщения -->
        <td style="width: 80%;"><input type="text" id="pac_text" class="r5" value=""></td>
        <!--<div id="colorSelector"><div></div></div>!-->
      </tr>
</table>
<table width="487">
        <!-- Кнопка "Отправить" -->
        <td width="141"><input type="submit" value="Отправить"></td>
        <td width="334"><p><div id="jPicker">
        <span id="Expandable"></span></div><p>
       
        <div class="bsPanel">
 <div class="bsPanel-hide">
    <table>
    <div id="sm">
        <img class="sm" title="1" src="smile/001.gif" />
        <img class="sm" title="2" src="smile/002.gif" />
        <img class="sm" title="3" src="smile/003.gif" />
     </div>
    </table>
 </div>
 <div class="bsPanel-button">
   <input type="button" id="smile" value="добавить смайл" style="margin-left:7px; width:120px; height:30px">
 </div>
 </div>
</td>
</table>
</form>
<script type="text/javascript">
 
$('#sm img').click(function(){
 var smtit = $(this).attr("title");
 alert(smtit);
 
$("#pac_text").append("smtit");
});
</script>

$('#sm img').click(function(){
 var smtit = $(this).attr("title"), pac = $("#pac_text");
 pac.val(pac.val()+smtit);
});