title: Inserting HTML into DIV using JQuery
body: <p>I've got a bunch of buttons nested within div tags in my html</p>
  
  <pre><code>&lt;div class="button-wrapper"&gt;
      &lt;button class="button-class"&gt;Click here&lt;/button&gt;
  &lt;/div&gt;
  &lt;div class="button-wrapper"&gt;
      &lt;button class="button-class"&gt;Click here&lt;/button&gt;
  &lt;/div&gt;
  ...
  </code></pre>
  
  <p>Clicking on the button posts some data using JQuery and returns some HTML through a .ajax success function. I'm trying to replace the content of the div for each button that is clicked, but for some reason my JQuery selector doesn't seem to be working.</p>
  
  <p>I'm trying the following within my success function:</p>
  
  <pre><code>$(this).parent().html(data);
  </code></pre>
  
  <p>I know that the data is being posted successfully and that the success function is working. What's weird is that the following works:</p>
  
  <pre><code>$(".button-wrapper").html(data);
  </code></pre>
  
  <p>but obviously this adds the HTML to every div, not just the one for the button that is clicked.</p>
  
  <p>Does anyone know where I might be going wrong here?</p>