FireFox 中的 JQuery text() 中丢失了新行

Question

I have a DIV at the page which I want user to be able to download as a text file (this is a license key). This DIV has \n symbols which is correctly displayed using white-space: pre; . I use the code bellow to create temporary <a> link with DIV content and download it. This works fine in Chrome, but FireFox loose the new-line symbols and I get single-lined text.

downloadLicenseBtn = $("#download_license");
downloadLicenseBtn.click(function(e){
    e.preventDefault();
    var $temp = $("<a>");
    $(body).append($temp);
    $temp.attr({
        download: 'license.txt',
        href: "data:text/html," + $('.edd_sl_license_key').text() 
        })[0].click()
    $temp.remove();
});

I tried to use JQuery html() function instead of text() , tried to set up data:text/plain;charset=utf-8 . No luck. :(

JSFiddle here: https://jsfiddle.net/movs21/vy4ukdpr/

Answer 1

Need to use encodeURIComponent( text ) , also it's possible to replace \r\n with %0D%0A: replace('\n', '%0A', text) .

Same question here: Javascript export text file not recognizing \r\n in firefox