Getting a complete string from server, when assigned to variable in JS it is not complete

so I sent a response from my backend to my JS. Server responded with

{id: 347, name: "Dummy One", date: "July 14, 2020", status: "APPROVED"}

When using val.name to a table, it displays the complete value but when I assigned it to a variable, I am only getting the "Dummy" value.

Here's my JS:

btns = "<td><button class='btn' data-name="+val.name+"</button></td>";

$('.btn').click(function(){
     var name = $(this).attr('data-name');
     console.log(name);
});

via Chebli Mohamed