title: Uncaught TypeError: Cannot call method 'toLowerCase' of undefined
body: <p>I am having an issue that I can not figure out. I am trying to fadeOut a div and then remove it, and everything is working fine except I keep getting the error message above. Here is the function:</p>
  
  <pre><code>$(field).siblings('.error').fadeOut(200, function(){
     $(this).remove(); 
  });
  </code></pre>
  
  <p>Pretty straight forward you would think. When I console.log <code>field</code>, I get the correct element and when I console.log <code>$(this)</code> inside that function, I also get the right element. The div fades out correctly, but for some reason, <code>$(this).remove()</code> is just killing it. Here are both elements:</p>
  
  <p><code>field</code>:</p>
  
  <pre class="lang-none prettyprint-override"><code>[input.user-name largeinput group-one, context: input.user-name largeinput group-one, jquery: "1.10.1", constructor: function, init: function, selector: ""…]
  </code></pre>
  
  <p><code>$(this)</code>:</p>
  
  <pre class="lang-none prettyprint-override"><code>[div.error, context: div.error, jquery: "1.10.1", constructor: function, init: function, selector: ""…]
  </code></pre>
  
  <p>I looked into the object itself just to make sure that it is the correct div and it is. So why would this error be thrown on it? I had it working when I was calling it directly from a blur, but when I moved it into a function and called it via <code>validateField(field)</code>, it screws it up.</p>
  
  <p>Obviously thats the issue, but I don't know why or how to fix it. Any advice from the community out there?</p>