Drupal 7.x and Custom JavaScript Files in a View

I have a Drupal 7.x view which currently displays about 4 results, all contained within a TABLE / set of TDs. I’m wanting to use some jQuery to make their presentation a bit better but for the life of me, I’m having problems targeting anything with the file I’ve created to do this.

Here’s where I am: Inside template.php, I’ve added drupal_add_js(drupal_get_path(‘theme’, ‘foobar’) . ‘/scripts/views/all_products_view.js’); within HOOK_views_pre_render(). This allows me to preprocess the view to use my custom JavaScript file. I’ve verified that the “all_products_view.js” is in the markup via “View Source” in the browser, so I think this part–adding the file into the markup–is working fine. I’ve also used Firebug to verify functionality of this file (i.e. - by using a console.log(‘Test’) command inside the file). “Test” shows up in console, so I know that part is working fine as well… However, I’m not sure if the actual jQuery itself is working as expected because I can’t seem to do anything with it yet.

Here’s what I have right now inside my file:

(function($){
    $("body").css({"background":"red !important"});
}(jQuery));

This code does nothing and Firebug doesn’t show the background being listed inside the CSS properties of “body”, so something isn’t getting through.

The 1st and last line above, from what I understand, does nothing more than create a memory alias for referencing the jQuery object. Right? In Drupal 6.x, I’d just use something like “$(document).ready(function(){});” and put everything I needed inside that, but when I try the same approach here in Drupal 7.x, it doesn’t work and Firebug complains.

I can’t get anything to happen when I put anything inside the first and last lines above but Firebug isn’t complaining at all about anything (did I JUST create an anonymous function that isn’t being called?–My jQuery basics isn’t very sharp, obviously)… So I’m at a loss. (I got that code from a Drupal page I found about “Working with JavaScript”, but clearly I’m not following it correctly or else I’ve misunderstood something.)

Help is appreciated.

Looks like I found a solution…

This worked for me for Drupal 7.x:

(function ($) {
      $(document).ready(function(){

      });
})(jQuery);

I guess it just boiled down to me not telling it to execute everything when the page was “ready”… Got the answer from Stackflow: http://stackoverflow.com/questions/7918473/jquery-script-not-loading-in-drupal-7