title: Change CSS style on button click?
body: <p>I would like to change some of css style properties on div element when I click button, but I don't have that much experience nor I can find anything online to help me.
  At the present moment this is how my code looks like.</p>
  
  <pre><code>&lt;button class="button1"&gt;Click&lt;/button&gt;
  &lt;div class="popup_middle"&gt;
  &lt;/div&gt;
  &lt;div class="grayout"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>and my CSS looks like this </p>
  
  <pre><code>.grayout {
      position: fixed;
      top: 0px;
      left: 0px;
      width: 100%;
      height: 100%;
      z-index: 99;
      visibility: hidden;
      background-color: #000;
      filter: alpha(opacity = 55);
      opacity:.80;
  }
  
  .popup_middle{
      position: fixed;
      background: url(../images/bg-food-order.jpg);
      border: none;
      top: 50%;
      left: 50%;
      width: 350px;
      height: 250px;
      margin-top: -125px;
      margin-left: -175px;
      z-index: 100;
      visibility: hidden;
  }
  </code></pre>
  
  <p>Please could you pleas give me some advice or code sample with JS that is going to solve my problem.</p>
  
  <p>Thanks in Advance ,
  David</p>