giving link inside a table row using javascript

Question

I am passing values to a table from my dropdown values using JavaScript.

I need to give a link on the last row of my table. I tried the following code, but it's not working. Can anyone suggest any other idea please?

$("#btnadd").click(function(){
    var lov_name  = $("#lov_name option:selected").text();
    var lov_value = $("#lov_value").val();
    var markup    = "<tr><td>" + lov_name + "</td><td>" + lov_value + "</td><td><a href="#"> Edit</a></td></tr>";

    $("table tbody").append(markup);
    $(".alert-success").css('display','block');
});

Answer 1

Change var markup = "<tr><td>" + lov_name + "</td><td>" + lov_value + "</td><td><a href="#"> Edit</a></td></tr>";

to

var markup = "<tr><td>" + lov_name + "</td><td>" + lov_value + "</td><td><a href='#'> Edit</a></td></tr>";

note the quotes in a href='#'

 $("#btnadd").on('click',function(){ var lov_name = $("#lov_name option:selected").text(); var lov_value = $("#lov_value").val(); var markup = "<tr><td>" + lov_name + "</td><td>" + lov_value + "</td><td><a href='#'> Edit</a></td></tr>"; $("table tbody").append(markup); $(".alert-success").css('display','block'); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <select id="lov_name"> <option value="1">One</option> <option value="2">Two</option> <option value="3" id="lov_value">Three</option> </select> <button id="btnadd">Add row</button> <span class="alert-success" style="display: none;"></span> <table> <tbody> </tbody> </table>