title: jQuery get background-color from two clicked divs and then compare them
body: <p>So I'm trying to make a memory game and the project is going forward slow but steady.</p>
  
  <p>I have a 4x4 layout of divs with class "card" and pair-unique colors. I'm trying to make something along these lines:</p>
  
  <p>Click one div, get color, save to pick1.
  Click another div, get color, save to pick2.
  Compare the two.</p>
  
  <p>For now im not even comparing, but simply alerting the variables pick1 and 2 to see what I get from clicking.</p>
  
  <p>I've tried some different ways of retrieving the background-color from the divs and for now I'm using the following:</p>
  
  <pre><code>$('.card').click(function(){
      pick1 = $(this).css('background-color');    
  });
  
  $('.card').click(function(){
      pick2 = $(this).css('background-color');
  });
  
  
  alert(pick1 + " and " + pick2);
  </code></pre>
  
  <p>But it just alerts straight away and shows the divs afterwards. If I make it run this part twice it simply alerts twice instead, and then shows the divs.</p>
  
  <p>How do I make it let me click before alerting? I'm new to jQuery since yesterday and haven't used javascript at all for two years :p</p>
  
  <p>here's an example: <a href="http://jsfiddle.net/94jerdaw/WJQkA/" rel="nofollow">http://jsfiddle.net/94jerdaw/WJQkA/</a></p>
  
  <p>Also, is there a better way of comparing the divs instead of background-color? It's in rgb format, if that's even possible to compare as it is?</p>