Javascript 如何使用jquery显示从A-D开始的文本

当我单击A-D时，表数据必须只显示从A到D之间开始的名称。如何使用jquery实现这一点

---

感谢您，以下是您的样品表：

<button id="ad">A-D</button>

<table id="personnel" border=1>
    <thead>
       <tr>
         <th>ID</th>
          <th>First Name</th>
       </tr>
    </thead>
    <tbody>
       <tr>
          <td class="pid">1</td>
          <td class="firstname">Alan</td>        
       </tr>
       <tr>
          <td class="pid">2</td>
          <td class="firstname">Alex</td>        
       </tr>
       <tr>
          <td class="pid">3</td>
          <td class="firstname">Charlie</td>        
       </tr>
       <tr>
          <td class="pid">4</td>
          <td class="firstname">Edward</td>        
       </tr>
        <tr>
          <td class="pid">5</td>
          <td class="firstname">Jack</td>        
       </tr>
       <tr>
          <td class="pid">6</td>
          <td class="firstname">Sam</td>        
       </tr>
   <tbody>
</table>

---

下面是一个

我创建了一个易于理解的片段，介绍了如何实现这种过滤：

var$table=$（'table'）；
$（'.filter'）。单击（filterTable）；
函数过滤器表（e）{
变量分隔符=$（this.data（'value'）；
//查找所有行中的所有第二个单元格
$table.find（'tr'）。find（'td:eq（1））。每个（函数（）{
var tr=this.parentNode，//获取单元格的行
firstChar=this.textContent[0].toLowerCase（），//重要。。
validRow=firstChar>=分隔符[0]&&firstChar绑定一个单击处理程序，并按其名称的第一个字符对其进行筛选。请尝试编写代码。
   $('#ad').click(function() { 
        var delimiter = 'ABCD';
        $("#personnel td.firstname").each(function(){
            if(curr.indexOf($(this).text().substr(0,1)) != -1){
                 $(this).parent().show();

            }else{
            $(this).parent().hide(); 
            }
        });

        });