I am trying to extend the functionality of an existing google chrome extension. Using the Wrike google chrome extension, my goal is to add a button (or buttons) which will add some text to the description field (a textarea). The desired effect will be that if a user clicks an Add Template button, the code/text will be inserted into the textarea with id=description which is native to the Wrike chrome extension. Below you will find some of the code that I have been working with.

Here is the description part of the form. Located in createTask.html

<div class=main-description main-row>

    <textarea placeholder=Click to add description id=description class=main-description-text></textarea>

</div>

This is the button that I created which will initiate adding the text to the textarea:

<span class=btn m-green btn-addtemp id=link>Add Template</span>

Within template.js (which is properly linked to as an external .js file within createTask.html:

function insertText(text) {

    document.getElementById(description).innerHTML = text;

}



document.addEventListener('DOMContentLoaded', function() {

    var link = document.getElementById('link');

    link.addEventListener('click', function() {

        insertText('Sample text here');

    });

});

I can get this code to insert the 'Sample text here' into a div with an ID, but cannot get it to insert into the textarea with id=description. Any help would be greatly appreciated and I am more than happy to provide more detailed information if necessary. Thanks!