I am trying to add the download attribute to an tag dynamically. Here is what I have so far:

$(fclass).append('<a href="/files/'+$days[$i][2][1]+'" download>'+$days[$i][2][0]+'</a>');

Which produces this:

<a href="/files/day0.pdf" download="">Slideshow (Notes)</a>

I also added the exact same tag as this produces into my HTML manually, but instead of

<a href="/files/day0.pdf" download="">

I used

<a href="/files/day0.pdf" download>

The manual version works perfectly, and automatically downloads the file, however, the dynamically placed version does not. I have also tried this:

$(a).attr("download","/files/day0.pdf");

But this does not seem to work. Any ideas on how to fix this? Thank you very much.

I am trying to add the download attribute to an tag dynamically. Here is what I have so far:

$(fclass).append('<a href="/files/'+$days[$i][2][1]+'" download>'+$days[$i][2][0]+'</a>');

Which produces this:

<a href="/files/day0.pdf" download="">Slideshow (Notes)</a>

I also added the exact same tag as this produces into my HTML manually, but instead of

<a href="/files/day0.pdf" download="">

I used

<a href="/files/day0.pdf" download>

The manual version works perfectly, and automatically downloads the file, however, the dynamically placed version does not. I have also tried this:

$(a).attr("download","/files/day0.pdf");

But this does not seem to work. Any ideas on how to fix this? Thank you very much.

• javascript
• jquery
• html

• You left the quotes out of $(a) – j08691 Commented Jun 27, 2016 at 18:17
• @j08691 a is variable of a dynamically created <a> tag, not a single a element. – Trevor Judice Commented Jun 27, 2016 at 18:23
• @PranavCBalan Still just links to the file, seems very odd. Not sure why, no download though. – Trevor Judice Commented Jun 27, 2016 at 18:24
• $(a).attr("download","/files/day0.pdf"); assigns the url to download attribute. Aren't you trying to assign the url to href? – YSJ Commented Jun 27, 2016 at 18:24
• @YSJ The download attribute is meant to just download the file without redirecting to a separate page. So, in doing so, you must reference the files within the download attribute. I also tried using href, and just setting download to a attribute with no parameters, however this does not work. – Trevor Judice Commented Jun 27, 2016 at 19:00

2 Answers 2

The answer is

$("a").attr("download", true);

<script src="https://ajax.googleapis./ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<a href="file-to-download.txt">Download the file</a>

Just checked an it is working :D

Did you try using Props ?

$(a).prop("download","/files/day0.pdf");