Search input focus() function with jQuery

Question

I want to make a search box when user focus on input field, background of submit button will be changed. Please can you help me to do this. Thank you in advance.

<script>
$(document).ready(function(){
    $("input#bigsboxh").focus(function(){
        $("submit#bigsboxhsub").css({"background-color": "#137ff3"", "opacity": "1"});
    });
});
</script>

<input type="text" id="bigsboxh" name="s" placeholder="search"/>
<button type="submit" id="bigsboxhsub"><i class ="fal fa-search"></i></button> 

Answer 1

1. You have unnecessary quotes "#137ff3"".
2. Use only the id and not also the tag name $("#bigsboxh")

$(document).ready(function(){
    $("#bigsboxh").focus(function(){
        $("#bigsboxhsub").css({"background-color": "#137ff3", 'opacity':'1'});
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="bigsboxh" name="s" placeholder="search"/>
<button type="submit" id="bigsboxhsub"><i class ="fal fa-search"></i>try </button>