how to concate the jquery clone object to string -

i have select2 box cloned , want concatenate cloned object string , append target field. html

<select data-placeholder="select billable item" name="nvoice_billable_itemid" id="invoice_billable_itemid" class="invoice_billable_itemid">     <option value=""></option>     <option value="35089">initial</option>     <option value="35088">standard</option> </select> 

i use code initialize select js code.

 var select_billable; $(document).ready(function() {     select_billable = $('.invoice_billable_itemid').clone();     $(".nvoice_billable_itemid").select2({         allowclear: true     });}); 

on function call add_fields create clone object , after concatenating string append target element. clone object created after append string showing [object object]in place of cloned object in sting . how can concatenate object string select box visible ??

//on call add field item function add_fields(item_type){     if(item_type == "billable"){         //   create clone of select2 box         var newbillableselect = select_billable.clone();         //function concate select2 box string , append         appendrow(newbillableselect);         //initilizing new select2 box         newbillableselect.select2();        }else if(item_type == "product"){         var newproductselect = select_product.clone();         appendrow(newproductselect);         newproductselect.select2();       } } function appendrow(selectbox){     var tr = '<tr class="fields_group" id="fields_group_itemid">'+         '<td>'+ selectbox.html() +'</td>'+         '<td>$<input type="text" style="width: 60px" size="30" name="unit_price[]" id="unit_price"></td>'+         '<td><input type="text" style="width: 45px" size="30" name="quantity[]" id="quantity"></td>'+         '<td><input type="hidden" name="tax_id" id="tax_id"><label class="tax_name">n/a</label><input type="hidden" name="tax_rate[]" id="tax_rate"></td>'+         '<td>$<input type="text" value="0.00" size="10" readonly="readonly" name="net_price" id="net_price" class="read_only_text right_align_text" style="background-color: #fff;border:none;width: 100px;box-shadow:none "></td>'+         '<td><input type="hidden" value="false" name="net_price[]" id="net_price"><a tabindex="-1" onclick="remove_invoice_item_fields(this); return false;" href="#" class="link_red link_small">remove</a></td>'+         '</tr>';     $('#items_tbody').append(tr); } 

ok, you're getting close. .html() method return string of html, except return inner html of element (i.e. element's content/children). in order html element itself, either wrap select within div , match div jquery selector, or temporary element, such as:

'<td>'+ $('<div>').append(selectbox).html() +'</td>'