I want to add i tag to button. Basically I want to add FontAwesome icon to a button but when I'm adding it, it appears like a string. Here's my code:
<script>
function Draw_Button() {
var downloadButton = document.createElement("button");
downloadButton.textContent = '<i class="fa-solid fa-arrow-down-to-line"></i>';
downloadButton.style.borderRadius = "100%";
downloadButton.style.backgroundColor = "orange";
downloadButton.style.width = "50px";
downloadButton.style.height = "50px";
downloadButton.style.fontSize = "14px";
downloadButton.style.position = "relative";
downloadButton.style.float = "right";
downloadButton.style.bottom = "55px";
}
</script>
Perhaps use .innerHTML instead of text content. As textContent outputs a string, but you want to include html
You have to use .innerHTML. See the code below
downloadButton.innerHTML = "<i class='fa-solid fa-arrow-down-to-line'></i>";
don't forget to append the button to your document body
document.body.appendChild(downloadButton);