给下拉链接一个函数

I need your help.

I create a Dropdown Menu and now I want when I click an Item from the Dropdown to fill the textarea with different Texts.

<div class='row'>
        <div class='col-md-12'>
            <div class ='nav-tabs-custom'>
                <ul class='nav nav-tabs'>
                    <li class='dropdown'>
                        <a class='dropdown-toggle' data-toggle='dropdown' href='#'>
                            Tab 1<span class='caret'></span>
                        </a>
                        <ul class='dropdown-menu'>
                            <li class='dropdown-header'><b>Zeitraum</b></li>
                            <li class='divider'></li>
                            <li><a role='menuitem' tabindex='1' href='#1_1'>DP 1</a></li>
                            <li class='divider'></li>
                            <li><a role='menuitem' tabindex='2' href='#1_2'>DP 2</a></li>
                            <li><a role='menuitem' tabindex='3' href='#1_3'>DP 3</a></li>
                            <li><a role='menuitem' tabindex='4' href='#1_4'>DP 4</a></li>
                        </ul>
                    </li>
                </ul>
                <textarea>

                </textarea>
            </div>
        </div>
    </div>

The Dropdown is fine, but put different Texts in the textarea I hope you can help me, I am new in this kind of Coding.

Best regards Noel007

PS: Sry for my bad english :D

You can write a click function for li

    <ul class='dropdown-menu'>
                        <li class='dropdown-header'><b>Zeitraum</b></li>
                        <li class='divider'></li>
                        <li><a role='menuitem' onclick=“replaceTextInTextArea(‘sampletext’)” tabindex='1' href='#1_1'>DP 1</a></li>

                    </ul>
                </li>
            </ul>
            <textarea id=“textarea”>

            </textarea>

In js file

replaceTextInTextArea(text){
document.getElementById('textarea').value = text;
}