JSFiddle - React, Tailwind, and code Playground

HTML

<div id="search_field_container">
    <input type="text" name="search_field" id="search_field" maxlength="100" placeholder="Search by item name or #tag" value="Search by item name or #tag" onclick="value=''" />
    <button id="search" name="search_button">s</button>
</div>

JavaScript

//Search function
$(document).ready(function(){
    console.log("In anonymous function.");
    
    $("#search").on('click', function(event){
        alert("In click handler");
        search();
    });
    
    $("#search_field").bind('keyup', function(event){
        alert("In keyup handler");
        
        var code = (event.keyCode ? event.keyCode : event.which);
        
        if(code == 13){
            alert("In enter handler");
            search();
        }
    });
    
});



function search(){
    alert("Something happened!");
    var searchTerm = $("#search_field").val();
    alert("You're trying to search for "+searchTerm);
}