Appending an element in jquery

Question

var main_div = $('div[class^="select"]');  
var download_button = document.createElement('a');

download_button.setAttribute("id", "download");
download_button.style.color = "blue";
download_button.href = "#";
download_button.innerHTML = "Download";

main_div.append(download_button);

Nothing Happens , no new element is appended to select what is wrong with this?

Answer 1

Use

main_div.append(download_button);

Instead of

main_div.appendTo(download_button);

Update -

DEMO

Answer 2

You can do this in jQuery like this:

 var main_div = $('div[class^="select"]'); 

 $("<a/>")
   .attr("id","download")
   .css("color","blue")
   .attr("href","#")
   .html("Download")
   .appendTo(main_div);

Answer 3

Do not mix jQuery and JS like you did...

var main_div = $('div.select');  
var download_button = $('<a id="download" style="color:blue;" href="#">Download</a>');

main_div.append(download_button);