title: I have function but in firebug console it says its not a function where I am calling it?
body: <p>I am using a function in two sites but when I want to implement it to third site it does not work. When I look into firebug console it says its not a function. My function is in a separate file called profilter.js look like this:</p>
  
  <pre><code>jQuery.fn.sfProductFilter = function (options) {
      options = options || {};
      return this.each(function () {
          var pf = new SFProductFilter(this, options)
      })
  }
  </code></pre>
  
  <p>and I am calling it from a page and code is: </p>
  
  <pre><code>$(document).ready(function(){
              console.log($("ul.productSmall"));
              $('ul.productSmall').sfProductFilter(); //says not a function.
  });
  </code></pre>
  
  <p>I have checked through console.log followings
  1- jQuery is included already
  2- If I console.log from the js file it works but inside any code block it does not
  3- ul.productSmall shows right results in console.log</p>
  
  <p>I can provide link of site but just not providing it so moderator wont thinks its a spam. </p>
  
  <p>I have struggled a lot please let me know where I am making mistake?</p>
  
  <p><img src="https://i.stack.imgur.com/isCZY.png" alt="console look like"></p>