Display list using dropdown menu in HTML/Javascript

Question

Each option within the select tag is a different list that I currently have hidden from being displayed on the page. I want to display the list on my page depending on what the user selects from the dropdown. The javascript currently only displays the ID of the list in the console log.

<script>

        document.addEventListener('DOMContentLoaded', () => {
                document
                    .getElementById('myDropdown')
                    .addEventListener('input', handleSelect);
            });
        function handleSelect(ev) {
            let select = ev.target;
            
            console.log(select.value);
        }

        function handleData(ev) {
            let theInput = ev.target;
        }
    
    
    </script>

<label for="curlinks">Curriculum Link:</label>  
                    
    <select id="myDropdown">
    <option value="all">All Content</option>
    <option value="art">Art</option>
    <option value="business">Business and Enterprise</option>
    <option value="computing">Computing</option>
    <option value="english">English and Literacy</option>
    <option value="human">Humanities</option>
    <option value="languages">Languages</option>    
    <option value="maths">Maths</option>
    <option value="numeracy">Numeracy and Finance</option>
    <option value="science">Science</option>
    <option value="service">Service and Health</option>
    <option value="tech">Technology and Engineering</option>
    </select>

Answer 1

Try something like this:

document.addEventListener('DOMContentLoaded', () => {
    document
        .getElementById('myDropdown')
        .addEventListener('input', handleSelect);
});

function handleSelect(ev) {
    let select = ev.target;

    console.log(select.value);

    let list = document.getElementById(select.value);

    list.style.display = 'block';
}

function handleData(ev) {
    let theInput = ev.target;
}

<label for="curlinks">Curriculum Link:</label>  
                    
<select id="myDropdown">
<option value="all">All Content</option>
<option value="art">Art</option>
<option value="business">Business and Enterprise</option>
<option value="computing">Computing</option>
<option value="english">English and Literacy</option>
<option value="human">Humanities</option>
<option value="languages">Languages</option>    
<option value="maths">Maths</option>
<option value="numeracy">Numeracy and Finance</option>
<option value="science">Science</option>
<option value="service">Service and Health</option>
<option value="tech">Technology and Engineering</option>
</select>

<!-- The lists -->
<div id="art" style="display: none">Content of art's list</div>
<div id="business" style="display: none">Content of business's list</div>
<!-- etc... -->