html diable text box when radio button is selected

I am trying to write javascript to disable textbox if radio benter code hereutton is selected. I have 4 options for radio button and corresponding textbox. even if I am selecting radio button 2 I am able to write values in radio 1 text and submit. So want to add method on click or on change of radio button selection option. I have below javascript function but its not being called on event. Am I doing anything wrong, why javascript is not being called? any help would be appreciated. I am new to javascripts.
enter image description here

{% extends "layout.html" %}
{% block body %}
<html>
<head>

    <meta charset="UTF-8">
    
               <script type="text/javascript">
    
        function EnableDisableTextBox() {
            alert("good")
            var chkYes = document.getElementById("search1");
            alert("Today's date is " chkYes);
            var text1 = document.getElementById("text1");
            alert('java script')
            text1.disabled = chkYes.checked ? false : true;
            if (!text1.disabled) {
                text1.focus();
            }
        }
    </script>
    <form method="post">
        <br><br><br>
        <input type="radio"   onchange="EnableDisableTextBox()"   align="center" name="search" id="search1" value="" > By Keyword <input type="text" id="text1" name="text1" for="search1"></input> <br>
        <input type="radio" align="center" name="search" id="search2" value="" id="search2" > In PostalCode <input type="text"  name="text2" id="text2" for="search2"></input><br>
        <input type="radio" align="center" name="search" id="search3" value="" id="search3" >Within<input type="number" name="text3" id="text3" for="search3" step="1" max="150" min="0">miles of me</input><br>
        <input type="radio" align="center" name="search" id="search4" value="Search4" id="search4" >In My PostalCode<br><br><br>
        <button name="button"  id="btn" onclick="window.location.href='/search/{{search}}'">Search</button>
    
           </form>
    
        </head>
    
    
    </html>
    
    {% endblock %}