Q: Jquery returning some unwanted data in Ajax success I have a Ajax method like this using Jquery.
 function add_item()
 {
 item_name=$("#item_names").val()
 var pars = item_name;
 $.ajax({
            url: "/billing/add_bill_detail",
            type: "get",
            dataType: "html",
            data: {"pars" : pars},
            success: function(returnData){
            alert(returnData)
            $("#aaa").append(returnData).html;
            }
        });

}
if i puts alert for the returnData its returning with some extra data. Like as follows.
 <!DOCTYPE html>
 <html>
 <head>
 <title>SamplePro</title>

 <script src="/javascripts/jquery.js?1363935663" type="text/javascript"></script>
 <script src="/javascripts/jquery_ujs.js?1363935663" type="text/javascript"></script>
 <script src="/javascripts/application.js?1362549711" type="text/javascript"></script>
 <script src="/javascripts/jquery.js?1363935663" type="text/javascript"></script>
 <script src="/javascripts/application.js?1362549711" type="text/javascript"></script>
</head>
<body>

<tr class="tablehead">
 <td>
BAB-001
</td>
 <td>
BABY MASK 1
</td>
 <td>
 </td>
 <td>
     <input id="tax_rule_tax_rule" name="tax_rule[tax_rule]" size="30" type="text" value="sfdsf" />
 </td>
 </tr>
 </br>


</body>
</html>

But the file add_bill_detail actutall contain 
 <% if from != "reload" %>
 <tr class="tablehead">
 <td>
 <%=from ? item_details.item.item_code : ""%>
 </td>
  <td>
   <%=from ? item_details.item.name : ""%>
  </td>
 <td>
 </td>
   <td>
    <%= text_field 'tax_rule', 'tax_rule',:value => "sfdsf" %>
     </td>
  </tr>
 <%end%>
 </br>

Please help me to remove the unwanted Data. Thanks in Advance..
Updated Question:
i have added the follwoing scripts
 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
 <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
 <script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>

My actual problem because of this is..

here all the values from the add_bill_detail is going under one column. it should go to 4 columns.

updated add_bill_detail code..
 <table>
 <tr class="tablehead">
 <td>
 <%=from ? item_details.item.item_code : ""%>
 </td>
 <td>
 <%=from ? item_details.item.name : ""%>
 </td>
 <td>
 </td>
 <td>
    <%= text_field 'tax_rule', 'tax_rule',:value => "sfdsf" %>
</td>
<td>
    <%= text_field 'tax_rule', 'tax_rule2',:value => "vvvv" %>
</td>
</tr>
</table>


A: If you want to get the <tr class="tablehead"> tags, simply use the .filter() method.
alert($(returnData).filter('tr.tablehead').html()) should work!
EDIT: You are using a tr tag without the parent table tag. Hence, they get ignored in rendered HTML by the browser, browser strips off the tr tags and displays only the text. As jquery works on rendered html its behavior is the same.
Fix: Wrap your tr tags with the parent table tags and you should be good to go.
what I mean by that is:
<table>
    <tr class="tablehead">
     <td>
    BAB-001
    </td>
     <td>
    BABY MASK 1
    </td>
     <td>
     </td>
     <td>
         <input id="tax_rule_tax_rule" name="tax_rule[tax_rule]" size="30" type="text" value="sfdsf" />
     </td>
     </tr>
</table>

Notice the table tag wrapping your tr tag.
How to avoid this problem in future?
Always check what your rendered HTML looks like using a tool like Inspect Element in Chrome and Firebug in firefox. If you'll do that for your table you'll notice that the tr tags get stripped by the browser.
