title: How do i change input field background color based on onclick?
body: <p>I want to change the input field back-ground color based on gender selection.</p>
  <p>So far I have:</p>
  <pre><code> &lt;script src=&quot;https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js&quot;&gt;&lt;/script&gt;
  
  &lt;script&gt;
   $(document).ready(function(){
     $(&quot;#male&quot;).click(function(){
      $(&quot;#gender&quot;).css(&quot;backgroundColor:#0000FF&quot;);
   }); 
  &lt;/script&gt; 
  
  &lt;script&gt;
   $(document).ready(function(){
     $(&quot;#female&quot;).click(function(){
      $(&quot;#gender&quot;).css(&quot;backgroundColor:#FFC0CB&quot;);
   }); 
  &lt;/script&gt; 
  
  &lt;form&gt;
   &lt;label for=&quot;gender&quot;&gt;Gender:&lt;/label&gt;
   &lt;select id=&quot;gender&quot; name=&quot;gender&quot;&gt;
     &lt;option value=&quot;male&quot; selected&gt;Male&lt;/option&gt;
     &lt;option value=&quot;female&quot;&gt;Female&lt;/option&gt;
   &lt;/select&gt;&lt;br&gt;
  &lt;/form&gt;
  </code></pre>
  <p>This has not been working</p>