title: Delete/remove the closest element with a class
body: <p>I am trying to delete/remove the closest ".step" on ".delete" button click. So as it delete the .step above the .delete button.</p>
  
  <pre><code> &lt;div class="step"&gt;&lt;/div&gt;
   &lt;div class="new"&gt;&lt;/div&gt;
   &lt;div class="delete"&gt;&lt;/div&gt;
  
  &lt;div class="step"&gt;&lt;/div&gt;
   &lt;div class="new"&gt;&lt;/div&gt;
   &lt;div class="delete"&gt;&lt;/div&gt;
  
  &lt;div class="step"&gt;&lt;/div&gt;
   &lt;div class="new"&gt;&lt;/div&gt;
   &lt;div class="delete"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>Here is my jQuery: </p>
  
  <pre><code>   $('.delete').click(function(){
         $(this).find('div.step').remove();    
       });
  </code></pre>
  
  <p>How should I grub this step? Thank you for your help!</p>