JSFiddle - React, Tailwind, and code Playground

HTML

<form name="foobar">
  <select name="first">
    <option value="Hans Wurst">Hans Wurst</option>
    <option value="Freddy Kaputtlick">Freddy Kaputtlick</option>
  </select>
  <select name="second">
    <option value="ist top">top</option>
    <option value="ist ein Flop">Flop</option>
  </select>
  <button type="submit">Sach ma ehrlich</button>
</form>

<table id="output">
  <tr>
    <td></td>
    <td></td>
  </tr>
</table>

CSS

FORM { margin-bottom:25px; }
TD { margin:5px; padding:5px; border:1px dotted #ccc; }

JavaScript

document.querySelector( 'button' ).addEventListener('click' , function(e) {
    
		e.preventDefault();

		var _selectFirst = document.querySelector( 'select[name="first"]' );
		var _selectSecond = document.querySelector( 'select[name="second"]' );

		_firstVar = _selectFirst.options[_selectFirst.selectedIndex].value;
		_secondVar = _selectSecond.options[_selectSecond.selectedIndex].value;

		document.querySelector( '#output td:first-child' ).innerHTML = 'Feld1: ' + _firstVar;
		document.querySelector( '#output td:last-child' ).innerHTML = 'Feld2: ' + _secondVar;

		}

	);