Good Practice for DOM manipulation




var $input= $( '#input' ); // reference to dom element

$input.css( 'color' , 'red' );

$input.attr( 'value' , 'costam' );

$input.show();


The best method ( Chaining ) 

var $input = $('#input'); // reference to dom element

$input.css('color', 'red').attr('value', 'costam').show();

Extend current objects with jQuery

Note : its good practice to extend objects instead of recreate them


// Navigation component scripts
var bobcat = bobcat || {};

bobcat.components = $.extend(bobcat.components, {

    "navigation": (function() {
        this._init = function() {
            // some initial functions
        }

        return {
            init: this._init
        }
    })()
});


Extend current objects with jQuery

// Navigation component scripts
var bobcat = bobcat || {};

bobcat.components = $.extend(bobcat.components, {

    "navigation": (function() {
        this._init = function() {
            // some initial functions
        }

        return {
            init: this._init
        }
    })()
});