javascript - Cannot add two hyperlinks at the same time using JQuery -

i have application using asp.net mvc. trying put submenu @ side navigation when click on dropdown. since have multiple submenus single dropdown, put of side navigation. use code:

<li id="dd_vehicle" class="dropdown"> <a id="x_btn" href="#" class="dropdown-toggle" data-toggle="dropdown"  >vehicle <b class="caret"></b></a> <ul class="dropdown-menu">      <li id="item_registration">         @if (utils.isadmin())         {             @html.actionlink("registration", "registration", "home")         }     </li>     @*}*@       <li id="item_modify">         @html.actionlink("modify", "modify", "home")     </li>      <li id="item_history">         @html.actionlink("history", "history", "home")     </li>      <li id="item_vehicle_transaction">         @html.actionlink("transaction", "transaction", "home")     </li> </ul> </li>  $(document).ready(function () { $('#x_btn').on('click', function (evt) {     //evt.preventdefault();      $('#links_area').html('<a href="@url.action("registration", "home")" class="btn btn-primary">registration</a>');     $('#links_area').html('<a href="@url.action("transactionreport", "home")" class="btn btn-primary">modify</a>');      }); }); 

the problem is, cannot put 2 of links @ same time. "#links_area" holds 1 of links , last link added. please help. thank you.

you can use .append() instead of .html()

$(document).ready(function () {     $('#x_btn').on('click', function (evt) {         //evt.preventdefault();         $('#links_area').append('<a href="@url.action("registration", "home")" class="btn btn-primary">registration</a>');         $('#links_area').append('<a href="@url.action("transactionreport", "home")" class="btn btn-primary">modify</a>');      }); });