Get the value of select class options

Question

I'm working on a test/quiz and I can't solve a problem.

I like to grab the selected value from a option and print it to the result p.

 <div class="add">
            <div class="add__container">
                <select class="add__type">
                    <option value="0" id="a01" selected>No</option>
                    <option value="1" id="a02">Ocassionally</option>
                    <option value="2" id="a03">Yes</option>
                </select>
            </div>
        </div>

    <button class="btn" onclick="myValue()">Results</button>
    <p id="result">... </p>

And here is my Javascript code where I'm stucked:

function myValue(){    
var e = document.getElementById("s01");
var value = e.options[e.selectedIndex].value;
var text = e.options[e.selectedIndex].text;

document.getElementById('result').innerHTML = e;

};

    

Answer 1

try this code. I think this code work like you requirement.

function myValue(){    
        var select = document.getElementsByClassName("add__type")[0].value;
        document.getElementById('result').innerHTML = select;
};

 <div class="add">
            <div class="add__container">
                <select class="add__type">
                    <option value="0" id="a01" selected>No</option>
                    <option value="1" id="a02">Ocassionally</option>
                    <option value="2" id="a03">Yes</option>
                </select>
            </div>
        </div>

    <button class="btn" onclick="myValue()">Results</button>
    <p id="result">... </p>

something more..