title: Object [object Object] has no method 'sortable'
body: <p>I have a backbone/rails app that uses local storage and jquery ui. I developed it on one Rails 3.2.8 application, got it working, and then copied the code to the application (also Rails 3.2.8) that I use on the server, but before I pushed it to the server, I tested it on local host. Strangely, it doesn't work on the Rails app that's destined for the server. Just one jQuery ui method is causing me a problem on the new app, throwing this error. </p>
  
  <pre><code>Object [object Object] has no method 'sortable' 
  </code></pre>
  
  <p>When I comment out the sortable code from the render function below, the app works fine
  The version of jQuery is the same (1.8) in both apps as is the jQuery ui version (1.9.2) (the versions of backbone are the same too).  I checked the page source for both apps, and the files are being loaded in the same order.  While the original app works on both Chrome and Firefox, <strong>The one twist is that I'm getting the same error on both applications in Safari</strong>. I cleared the cache in every browser.  The code is wrapped in this <code>$(function(){   });</code></p>
  
  <pre><code>$(function() {
  
      ...ommitted code...
  
         window.App = new AppView();
  
  });
  </code></pre>
  
  <p>However, I also tried to put document ready code around the initialization of the app view, but it didn't change anything</p>
  
  <pre><code>$(document).ready(function() {
  
         window.App = new AppView();
  });
  </code></pre>
  
  <p>Given the above (and the code below), does the fact that neither work properly in Safari, but the original app works in Chrome and Firefox (while the other doesn't) indicate any possible problem area you could direct me to...Thank you in advance</p>
  
  <p><strong>Render function where sortable's located</strong> </p>
  
  <pre><code> render: function() {
              $(this.el).html(this.template(this.model.toJSON()));
               this.setText();
               var that = this;
               console.log(this.$("ul.bucket-companies"));
               this.$("ul.bucket-companies").sortable({
               dropOnEmpty: true,
               connectWith: "ul.bucket-companies",
               receive: function(event, ui) {
                var bucket = that.model;
                var id = $(ui.item[0]).attr("id");
                var company = Companies.get(id);
                var oldBucket = company.getBucket();
  
               company.setBucket(bucket.id);
               oldBucket.removeCompany(company.id);
               bucket.addCompany(company.id);
              }
             });
                return this;
              },
  </code></pre>
  
  <p><strong>Update.</strong></p>
  
  <p>This is what the console.log in the render function shows <code>console.log(this.$("ul.bucket-companies"));</code></p>
  
  <pre><code>[ul.bucket-companies, prevObject: i.fn.i.init[1], context: li.bucket-item, selector: "ul.bucket-companies", constructor: function, init: function…]
  0: ul.bucket-companies
  context: li.bucket-item
  length: 1
  prevObject: i.fn.i.init[1]
  selector: "ul.bucket-companies"
  __proto__: Object[0]
   feng.js:87
  </code></pre>