when the datalist is empty,item is not getting addedon clic

i m displaying 4 items in my datalist-dlproducts,when the button-btnaddtocart is clicked,i want data to be added to datalist-dlmycart....

the problem is when i keep dlmycart empty and click btnaddtocart,no item is added to dlmycart...but when i display one item in dlmycart on pageload and

click btnaddtocart, it adds the repective item to dlmycart.....

here's my code....

function Addtocart(pid) {

var productid = pid;

$.ajax({

url: "Addtocart.asmx/Addproducttocart",

contentType: 'application/json;charset=utf-8',//required if the web service returns xml and u want json...

data: JSON.stringify({ pid: productid }),

method: "post",

dataType: "json",

success: OnSuccess,

error: function (err) {

alert(err);

}

});

}

function OnSuccess(response) {

var JqueryXml = response.d;

var dlmycart = $('#dlmycart');

var row = dlmycart.find('tr').eq(0).clone(true);

$(".name1", row).eq(0).html(JqueryXml.Name);

$(".productId1", row).eq(0).html(JqueryXml.ProductId);

$(".description1", row).eq(0).html(JqueryXml.Description);

$(".imageUrl1", row).eq(0).html(JqueryXml.ImageUrl);

$(".image1", row).eq(0).attr("src", 'Images/' + JqueryXml.ImageUrl);

$(".price1", row).eq(0).html(JqueryXml.Price);

$(".quantity1", row).eq(0).html(JqueryXml.Quantity);

$(".lblid", row).eq(0).html(JqueryXml.ProductId);

$(".btnremovefromcart", row).eq(0).attr("data-pid",JqueryXml.ProductId);

dlmycart.append(row);

}

my datalist....

RepeatDirection="Horizontal" CellPadding="0" CellSpacing="0" BackColor="Aqua"

Width="100%">

<%# Eval("Name") %>

Productid:

<%# Eval("Productid") %>

Description

<%# Eval("Description") %>

ImageUrl:

<%# Eval("ImageUrl")%>

" width="160px" height="320px" />

Price:

<%# Eval("Price")%>

Quantity:

<%# Eval("Quantity")%>