title: Why am I getting Uncaught TypeError: Object #<an HTMLSelectElement> has no method 'find'?
body: <p><strong>Why am I getting:</strong></p>
  
  <blockquote>
    <p>Uncaught TypeError: Object # has no method
    'find' (anonymous
    function):8080/twolittlesheep/js/sizeColorDependancy.js:16
    c.event.handleajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js:63
    c.event.add.h.handle.oajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js:56</p>
  </blockquote>
  
  <p><strong>when I try to run a simple jQuery script?</strong> The script falls at the line where I use the find method in the next jquery code snippet:</p>
  
  <pre><code>$(document).ready(function(){
    $("select#p_sizesId").change(function(){
     var $colorsSelect = $("select#p_colorsId")[0];
     $("select#p_colorsId")[0].find('option').remove().end().append('&lt;option selected="selected" value="whatever"&gt;text&lt;/option&gt;');
    });
  });
  </code></pre>
  
  <p>In my head tag in the html I have:</p>
  
  <pre><code>&lt;script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"&gt;&lt;/script&gt;
  &lt;%-- &lt;script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"&gt;&lt;/script&gt; --%&gt;
  &lt;script type="text/javascript" src="js/sizeColorDependancy.js"&gt;&lt;/script&gt;
  </code></pre>
  
  <p><em>I am using Google Chrome (together with Developer Tools).</em></p>
  
  <p>All that I found as an explanation in another thread was that when using Chrome's developer tools, the problem arises. But I was running the code without using the Developer Tools and the same happened (the script didn't do anything => the error occurred).</p>