This is my drop down

```html
<div class="dropdown" >
    <button onclick="myFunction()" class="dropbtn">Course List</button>
    <div id="myDropdown" class="dropdown-content">
        <input type="text" placeholder="Search.." id="myInput" onkeyup="filterFunction()">

        {% for list in list1%}
            <a id="courseName" onclick="addCourse()"> {{list.courseName}}</a>
        {% endfor %}
    </div>
</div>

```

here i am trying to access value of the selected course name

```js
function addCourse() {
    var x = document.getElementById("courseName").value
    document.getElementById("demo").innerHTML = x;
}

```

But this is giving me "undefined" as a result.