title: jQuery $(this) not working when inside a function
body: <p>I have this simple function that copies some html, and places it in another div.
  If I put the code for the function in the click event it works fine, but when I move it into a function (to be used in multiple places) it no longer works.
  Do you know why this is?</p>
  
  <p>If I console.log($(this)); in the function it returns the window element.</p>
  
  <pre><code> function addHTMLtoComponent () {
          var wrapper = $(this).closest(".wrapper");
          var component = $(wrapper).find(".component");
          var componentCodeHolder = $(wrapper).find('.target');   
  
           $(componentCodeHolder).text(component.html())
        //console.log($(this));
   }
  
   $(".js_show_html").click(function () {
       addHTMLtoComponent();
   });
  </code></pre>
  
  <p>codepen here - <a href="http://codepen.io/ashconnolly/pen/ebe7a5a45f2c5bbe58734411b03e180e" rel="nofollow">http://codepen.io/ashconnolly/pen/ebe7a5a45f2c5bbe58734411b03e180e</a></p>
  
  <p>Should i be referencing $(this) in a different way?</p>