What Javascript Do I Use To Change The Information In The Table To Go With Whatever The User Clicks On And Presses Submit?

table#t01 {
    border-collapse: collapse;
    width: 50%;
    text-align:center; 
	vertical-align:middle;
}

table#t02 {
	border-collapse: collapse;
	width: 35%;
	float: right;
	text-align:center; 
	vertical-align:middle;
}
	
table, td, th{
    border: 1px solid black;
}
tbody tr:nth-child(odd) {
   background-color: ;
}
th {
	color: dark grey; 
}

<h1>Bay Area Colleges and Universities</h1>

<table id="t01">
    <tr>
    <th> Name </th>
    <th> SAT High </th>
    <th> SAT Low </th>
    <th> Tuition </th>
    </tr>
    <tr>
    <td>Stanford</td>
    <td>1570</td>
    <td>1380</td>
    <td>$44,757</td>
        </tr>
    <tr>
    <td>UC Berkeley</td>
    <td>1500</td>
    <td>1250</td>
    <td>$13,844</td>
        </tr>   
    <tr>
    <td>UC Santa Cruz</td>
    <td>1280</td>
    <td>1000</td>
    <td>$13,398</td>
        </tr> 
    <tr>
    <td>USF</td>
    <td>1270</td>
    <td>1070</td>
    <td>$41,450</td>
        </tr>  
    <tr>
    <td>SCU</td>
    <td>1380</td>
    <td>1190</td>
    <td>$43,812</td>
        </tr> 
    <tr>
    <td>Mills College</td>
    <td>1250</td>
    <td>1040</td>
    <td>$42,918</td>
        </tr> 
     <tr>
    <td>SFSU</td>
    <td>1110</td>
    <td>800</td>
    <td>$6,468</td>
        </tr>   
     <tr>
    <td>SJSU</td>
    <td>1160</td>
    <td>880</td>
    <td>$9,496</td>
        </tr>   
     <tr>
    <td>Sonoma State</td>
    <td>1090</td>
    <td>880</td>
    <td>$7,276</td>
        </tr>   
     <tr>
    <td>CalState East Bay</td>
    <td>1010</td>
    <td>800</td>
    <td>$6,550</td>
        </tr>                
        </table>
</br>

<table frame="box" id="t02">
<form action="">
    <tr>
    <th> Search Criteria </th>
    </tr>
    <tr>
       <td><input type="radio" name="public" value="public">Public
        <input type="radio" name="private" value="private">Private
        <input type="radio" name="don't care" value="don't care">Don't Care
        </td>
        </tr>
        <tr>
        <td>
        Maximum Tuition
        </td>
        </tr>
        <tr>
        <td font size="6">
        leave blank for don't care
        <input type="text" name="Maxt" value="">
        </td>
        </tr>
        <tr>
        <td>
        Maximum High SAT
        </td>
        </tr>
        <tr>
        <td font size="6">
        leave blank for don't care
        <input type="text" name="SATh" value="">
        </td>
        </tr>
        <tr>
        <td>
        Minimum Low SAT
        </td>
        </tr>
        <tr>
        <td font size="6">
        leave blank for don't care
        <input type="text" name="SATl" value="">
        </td>
        </tr>
        </table>
        
        <input type="submit" value="Update" >
</form>