title: CSS make different level divs.
body: <p>I've got a website that essentially makes boxes, you can click on the box, and it will expand, if you click again on the box, it was return to original size. This is done via: </p>
  
  <pre><code>$container.on(
    "click",
    ".resultLike",
    function(event){
      $('.resultLike').html("liked");
    }
  );
  </code></pre>
  
  <p>No, there's a div inside that box called <code>resultLike</code>, and when you click it, it also calls a function, but the issue is that the box closes.  I'm wondering if there's some css magic I can do to alter this. </p>
  
  <p>I tried setting the <code>z-index</code> to a number higher than the box.  No avail. </p>
  
  <p>Thanks!</p>