Display all CheckBoxes that starts with the selected link using jQuery in ASP.Net

Means i have used dynamic  checkbox now i have   B,G,R alphabet when i click on"B" it will display me checkbox which are having B has a first letter only.

Here is my code:

<link href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.9/themes/blitzer/jquery-ui.css"
        rel="stylesheet" type="text/css" />
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
    <meta charset="utf-8" />
    <script type="text/javascript">
        $(function () {
            $('#chkfilter').on('keyup', function () {
                var query = this.value;

                $('.listclass').each(function (i, elem) {
                    if ($(elem).find('label').html().toLowerCase().indexOf(query.toLowerCase()) != -1) {
                        $(this).attr('style', 'display:block');
                    } else {
                        $(this).attr('style', 'display:none');
                        
                    }
                });
            });

        });

    </script>

 <form id="form1" runat="server">
    <span class="key-alphabet marB20"><a>B</a> <a>G</a> <a>R</a> <a>Y</a> </span>
    <div>
        <label>
            <ul id="list" runat="server" style="list-style-type: none;">
            </ul>
        </label>
        <div id="filters" runat="server">
        </div>
        <input type="text" id="chkfilter">
    </div>
    </div>
    </form>

 public void  fillP()
    {
        string str = string.Empty;
        string str1 = string.Empty;
        string result = string.Empty;
        clsColor objcolor = new clsColor(true);
        clsColorProduct objProduct = new clsColorProduct(true);
        objcolor.getColor();
        for (int i = 0; i < objcolor.ListclsColor.Count; i++)
        {
            str += "<li class='listclass'><div class='filterblock'><input type='checkbox' id=" + objcolor.ListclsColor[i].ColorID + " name='chk' value=" + objcolor.ListclsColor[i].ColorName + " class='category'><div class='font'><div class='Color' style=background-color:" + objcolor.ListclsColor[i].ColorCode + "></div></div><label  class='font' for=" + objcolor.ListclsColor[i].ColorID + ">" + objcolor.ListclsColor[i].ColorName + "</label></div></li>";

            if (objcolor.ListclsColor[i].ColorID != 0)
            {
                str1 += "<td><div class='resultblock' ColorID=" + objcolor.ListclsColor[i].ColorID + " data-tag=" + objcolor.ListclsColor[i].ColorName + "><div class='desc'><div class='desc_text'><div class='main'><div class='sub'><div class='box'>" + objcolor.ListclsColor[i].ColorName + "<span class=''><img height='10px' style='margin-left: 4px;margin: 0px 0px -1px 4px;'/></span></div></div></div></div></div></div></td>";
                objProduct.getColorp();
                for (int j = 0; j < objProduct.ListclsColorProduct.Count; j++)
                {


                }
            }
        }
        list.InnerHtml = str;
        filters.InnerHtml = result;
       
    }