title: Change background color of an input when user clicks
body: <p>First of all, I think this question maybe is having an answer somewhere here on site and sorry for being repetitive but I can`t find what I want.</p>
  
  <p>So... I have a form with 4 inputs, I want when someone clicks on the input to type in the value background color to be changed, and when the user clicks somewhere else to change it back to normal.
  If anyone has multiple examples please write it down, I want to know more about how javascript works.</p>
  
  <pre><code> &lt;form&gt;
                  &lt;div&gt;
                      &lt;label for="name"&gt;NAME&lt;/label&gt;
                      &lt;input class="input" type="text" name="name" id="name" placeholder="Please enter your name"&gt;
                  &lt;/div&gt;
                  &lt;div&gt;
                      &lt;label for="company"&gt;COMPANY&lt;/label&gt;
                      &lt;input class="input" type="text" name="company" id="company"
                          placeholder="Leave it empty if you don`t have a name"&gt;
                  &lt;/div&gt;
                  &lt;div&gt;
                      &lt;label for="phone"&gt;PHONE&lt;/label&gt;
                      &lt;input class="input"  type="text" name="phone" id="phone"
                          placeholder="Please,enter your mobile phone"&gt;
                  &lt;/div&gt;
                  &lt;div&gt;
                      &lt;label for="email"&gt;EMAIL&lt;/label&gt;
                      &lt;input class="input" type="email" name="email" id="email" placeholder="Your email address"&gt;
                  &lt;/div&gt;
                  &lt;div class="message"&gt;
                      &lt;label for="message"&gt;MESSAGE&lt;/label&gt;
                      &lt;textarea class="input" name="message" id="message" cols="54" rows="15"&gt;&lt;/textarea&gt;
                  &lt;/div&gt;
                  &lt;a href="#" class="btn btn-large"&gt;Send&lt;/a&gt;
              &lt;/form&gt;
  </code></pre>