HOW TO ADD RECORD IN GRIDEVIEW USING JQUERY,JSON,AND WEBSERVICE

DESIGN THE PAGE:
  <div>
     <center>
    <div style="width:940px;">
    <li style="width:360px; list-style:none; text-align:right; float:left; padding-top:3px">&nbsp;</li>
    <li style="width:20px; list-style:none;  float:left; padding-top:3px; text-align:center; font-weight:bolder">&nbsp;</li>
     <li style="width:560px; list-style:none; text-align:left; float:left; padding-top:3px">&nbsp;<asp:Label ForeColor="Green" ID="lb1" runat="server" EnableViewState="false"></asp:Label></li>
    <li style="width:360px; list-style:none; text-align:right; float:left; padding-top:3px">EID</li>
    <li style="width:20px; list-style:none;  float:left; padding-top:3px; text-align:center; font-weight:bolder">:</li>
     <li style="width:560px; list-style:none; text-align:left; float:left; padding-top:3px"><asp:TextBox ID="tb" runat="server"></asp:TextBox></li>
      <li style="width:360px; list-style:none; text-align:right; float:left; padding-top:3px">Name</li>
    <li style="width:20px; list-style:none;  float:left; padding-top:3px; text-align:center; font-weight:bolder">:</li>
     <li style="width:560px; list-style:none; text-align:left; float:left; padding-top:3px"><asp:TextBox ID="tb1" runat="server"></asp:TextBox></li>
      <li style="width:360px; list-style:none; text-align:right; float:left; padding-top:3px">&nbsp;</li>
    <li style="width:20px; list-style:none;  float:left; padding-top:3px; text-align:center; font-weight:bolder">&nbsp;</li>
     <li style="width:560px; list-style:none; text-align:left; float:left; padding-top:3px"><input type="button" id="btn"  value="Save" style="width:80px"><asp:Button ID="Button1" runat="server" Text="Reset" Width="80" /></li>
     <li style="width:360px; list-style:none; text-align:right; float:left; padding-top:3px">&nbsp;</li>
    <li style="width:20px; list-style:none;  float:left; padding-top:3px; text-align:center; font-weight:bolder">&nbsp;</li>
     <li style="width:560px; list-style:none; text-align:left; float:left; padding-top:3px"><asp:GridView ID="gv" runat="server" ShowHeaderWhenEmpty="true"></asp:GridView></li>
    </div>
    </center>
    </div>
PAGE LOOKS LIKE:

WRITE THE JSON SCRIPT ON THE HEARDER:
  <script language="javascript" type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
      <script type="text/javascript">
          $(document).ready(function () {
              $('#btn').click(function () {
                  $.ajax({
                      type: "POST",
                      contentType: "application/json; charset=utf-8",
                      url: "WebService.asmx/GetNamesByID",
                      data: "{x: '" + $('#tb').val() + "',y: '" + $('#tb1').val() + "'}",
                      dataType: "json",
                      async: false,
                      success: function (data) {

                          for (var i = 0; i < data.d.length; i++)
                          {
                              $("#gv").append("<tr><td>" + data.d[i].EID + "</td><td>" + data.d[i].NAME + "</td></tr>");
                          }

                      }
                  });
              });
          });
         
   </script>
C# CODE:
 protected void Page_Load(object sender, EventArgs e)
    {
        DataTable dt = new DataTable();
        dt.Columns.Add("EID", typeof(string));
        dt.Columns.Add("NAME", typeof(string));
        gv.DataSource = dt;
        gv.DataBind();
    }
WEBSERVICE CODE:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Configuration;
using System.Web.Services;

/// <summary>
/// Summary description for WebService
/// </summary>
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
// To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line.
[System.Web.Script.Services.ScriptService]
public class WebService : System.Web.Services.WebService {
    DataClassesDataContext o = new DataClassesDataContext(ConfigurationManager.ConnectionStrings["DatabaseConnectionString"].ToString());
    public WebService ()
    {

        //Uncomment the following line if using designed components
        //InitializeComponent();
    }

 

    [WebMethod]
    public List<DEPT> GetNamesByID(string x, string y)
    {
        EMP p = new EMP();
        p.EID = Convert.ToInt32(x);
        p.NAME = y;
        o.EMPs.InsertOnSubmit(p);
        o.SubmitChanges();
        List<DEPT> q = new List<DEPT>();
        var m = from z in o.EMPs select z;
        foreach (var n in m)
        {
            q.Add(new DEPT { EID = n.EID, NAME = n.NAME });
        }
        return q;
    }
    [Serializable]
    public class DEPT
    {
        public int EID
        {
            get;
            set;
        }
        public string NAME
        {
            get;
            set;
        }
    }
   
}