Lista suspensa - exibir div ao clicar em uma opção
Você deve escrever uma função que 'mostre' a parte correspondente do formulário, dependendo do que o usuário selecionou. Por exemplo, se 'Pizza' for selecionado, a div # section2 com a pergunta sobre o tipo Pizza deverá ser mostrada.
Isso faz parte do código 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>
Como eu iria escrever uma função javascript para que quando eu clicar na pizza opção, ele irá exibir a seção 2? Eu sou um novato de javascript completo, então qualquer ajuda seria ótima.