jQuery （多个.parent连用）选择符选取问题

HTML代码片段如下：

……

<table>
<tr>
<td class="label">控制面板：</td>
<td class="ctrl">
<input type="button" value="▂" class="btn" />
<input type="button" value="▃" class="btn" />
<input type="button" value="▅" class="btn" />
<input type="button" value="▆" class="btn" />
<input type="button" value="█" class="btn" />
</td>
</tr>
<tr>
<td class="label">代码面板：</td>
<td class="input"><textarea></textarea></td>
</tr>
</table>
……

我想通过控制▂ ▃ ▅ ▆ █ 五个input 控制下面textarea的高度，我的jquery代码片段是：

……

$("input[value='▂']").click(function(){
$(this).parent().parent().parent().find("textarea").css('height',40);

});

$("input[value='▃']").click(function(){
$(this).parent().parent().parent().find("textarea").css('height',100);

});

……

我使用了三个.parent()来向上寻找父元素，本人觉得这样比较麻烦而且可读性不高，请问高手们在不改变HTML的情况下如何写出更简洁的代码呢？

<td class="input"><textarea></textarea></td>的class="input"难道不是唯一的？如果是唯一的，可以直接

$(".input").find("textarea");