Why new line is not applied when copying text to clipboard

Question

I previously asked "How to make a share button to share quote with post URL in Google blogger blog" and got solution.

Now I am trying to make fall back function because most browser not support Web Share API method and came up with solution.

<script>
//<![CDATA[
var title = document.title;
var url = window.location.href;

document.querySelectorAll('.shareBtn').forEach(function (btn) {
    var text = btn.previousElementSibling.textContent + '\n';
    btn.addEventListener('click', function () {
        if (navigator.share) {
            navigator.share({
                title: title,
                text: text,
                url: url
            });
        }else{
                var shareText = document.createElement('input');
                document.body.appendChild(shareText)
                shareText.value = text+url;
                shareText.select();
                document.execCommand('copy',false);
                shareText.remove();
                alert(" Text Copied");
            }
    });
});
//]]>
</script>

In if part var text = btn.previousElementSibling.textContent + '\n' line gap applied between text and url but when else part executed line gap not applied.

Answer 1

You need to use a textarea element instead of an input in createElement()