title: trying to make a value true on click with an if statement
body: <p>I am trying to change between colors on click in jquery. According to the picture below I have the default value 
  <a href="https://i.stack.imgur.com/ycpLA.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/ycpLA.png" alt="enter image description here"></a></p>
  
  <p>and then in this image when I click on the input box and then back on a button the background color stays on the input box rather than dissappears when any other button is clicked.
  <a href="https://i.stack.imgur.com/wbJys.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/wbJys.png" alt="enter image description here"></a>
  <a href="https://i.stack.imgur.com/EWgOD.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/EWgOD.png" alt="enter image description here"></a></p>
  
  <p>i'd like the background color to disappear when any of the buttons are clicked.</p>
  
  <p>here is my jquery:</p>
  
  <pre><code>    $("#donation-amount").click(function() {
  
           if ($(this).hasClass('inpt-first')) {
               $(this).css("background-color", "#c97e06");
               $("#default").removeClass('active');
               $("#btn2").removeClass('active');
               $("#btn3").removeClass('active');
           } 
  
          else{
              $(this).removeAttr("background-color") 
              $("#default").addClass('active');   
          }
  
      });
  </code></pre>
  
  <p>and here is my html:</p>
  
  <pre><code>   &lt;div class="choose-pricing"&gt;
            &lt;div class="btn-group"&gt;
            &lt;div class="buttons"&gt;
              &lt;button type="button" id="default" class="btn btn-default selectvalue hover-color active" value="50"&gt;50&lt;/button&gt;
              &lt;button type="button" id="btn2" class="btn btn-default selectvalue hover-color" value="100"&gt;100&lt;/button&gt;
              &lt;button type="button" id="btn3" class="btn btn-default selectvalue hover-color" value="150"&gt;150&lt;/button&gt;
              &lt;input type="Custom" name="donation-amount" class="inpt-first form-control" id="donation-amount" onclick="if(this.defaultValue == this.value) this.value = ''" onblur="if(this.value=='') this.value = this.defaultValue" value="Custom"&gt;
              &lt;/div&gt;
              &lt;input type="hidden" name="donation-amount-value" id="donation-amount-value"&gt;
            &lt;/div&gt;
            &lt;div class="money-donate"&gt;
              &lt;div class="display-amount" id="display-amount"&gt;
              &lt;/div&gt;
            &lt;/div&gt;
          &lt;/div&gt;
        &lt;/fieldset&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>any help would be appreciated!</p>