I am learning as i go here, apologize for something that should seem simple, but I can't figure it out. I have a <select> with multiple options, and am trying to build an order summary before check out. Everything is working, except the value is being returned for the selected option. IS there an easy solution that would allow the value to stay in place and just have the text of the option be returned on the order summary?
$(document).ready(function() {
$("select#option2").change(function() {
var selectedOption2 = $(this).children("option:selected").val();
$('.mk-step-2 span').text(selectedOption2);
});
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="option2">
<option value="" disabled selected hidden> Your Choice... </option>
<option value="option-1">option one</option>
<option value="option-2">option two</option>
</select>