Rozwijana lista - wyświetlanie div po kliknięciu opcji

Musisz napisać funkcję, która „pokazuje” odpowiednią część formularza w zależności od tego, co wybrał użytkownik. Na przykład, jeśli wybrano „Pizza”, należy wyświetlić sekcję div # 2 z pytaniem o rodzaj pizzy.

To jest część kodu html

<code><form id="survey" action="#" method="post">

<div id="section1">
    <label for="food">What is your favourite type of food?</label>
    <select id="food" onchange="selection()">
        <option value="pizza">Pizza</option>
        <option value="mex">Mexican</option>
        <option value="thai">Thai</option>
    </select>
</div>
<div id="section2">
    What is your favourite type of pizza?<br>
    <label for="hawaiian">Hawaiian</label><input type="radio" id="hawaiian">
    <label for="supreme">Supreme</label><input type="radio" id="supreme">
    <label for="vegetarian">Vegetarian</label><input type="radio" id="vegetarian">
</div>
</code>

Jak napisałbym funkcję javascript, aby po kliknięciu opcji pizza wyświetlała się sekcja 2? Jestem kompletnym nowicjuszem w języku javascript, więc każda pomoc byłaby świetna.

questionAnswers(2)

yourAnswerToTheQuestion