按钮onclick显示href链接

Question

Hi I have a problem that I cannot work out I have a HTML button code is below when I click this I want a java script function to run that will display links on the page and then when I press the second button I want a separate set of links to display any ideas how to do this all my HTML elements are within a

my HTML button is this i have put type on the button because it was acting like a submit button when it was within a form.

echo"<button type=\"button\" id=\"1\" onclick =\"display(firstbox)\">";
echo "Firstbox";
echo "</button>";

this is the div that everything is displayed within

echo "<div id=\"links\"> 
echo "</div>";

my JavaScript function is this

$("#1").click(function(){
$("#links").text("'<div id="id">' heeellllooooo '</div>'   ");
});

when I try this nothing is displayed when I get rid of the HTML elements it shows the hello is it because I have used .text do I need to change this to something else or is there a better way to do this using a different javascript or jquery functions or maybe css anything would be great

any ideas or help would be much appreciated i just cant seem to get this to work no matter what i try

in the end i would like these links within the section it says hello these are the links

<br/>
<br/>
<a href="./downloads/"> Guide to Producing a Video</a>
<br /><br />
<a href="./downloads/"> Guide to Producing a Academic Exercise</a>
<br /><br />
<a href="./downloads/"> Questionnaire</a>
<br /><br />
<a href="./downloads/"> Guide to Producing a Video</a>
<br /><br />
<a href="./downloads/"> Guide to Producing a Academic Exercise</a>
<br /><br />
<a href="./downloads/"> Questionnaire</a>

Answer 1

Use .html() . $.html() treats the string as HTML, $.text() treats the content as text.Try this:

$("#1").click(function(){
$("#links").html("<div id=id>heeellllooooo</div>");
});

Answer 2

problem in quotes and tag

$("#links").html("<div id='id'> heeellllooooo </div>");

if id is a javascript variable.

Answer 3

Try this, DEMO

  $("#1").click(function(){
    $("#links").html('<div id="id">heeellllooooo</div>');
  });