jQuery(document).ready(function($) {
	(function() {
		// We create a JS "class" called 'update_url' which takes a css class as a parameter
		// assigns that parameter to the property of the 'update_url' JS "class" ('this._class')
		// calls a function
		function update_url(_class) {
				this._class = _class;
 				this.update();
		}
		
		// The update function binds a css class selector to a click event
		// which stores the element's 'href' and calls the 'mod_url' function
		update_url.prototype.update = function() {
			$('.' + this._class).click(function() {
				var append = $(this).attr('href');
				testing.mod_url(append);
			});
		}
		
		// in this function we are making sure that when the user clicks on the css class
		// we passed earlier the page does not scroll to the relevant id
		// an empty div is assigned the id initially, the url is then updated
		// and then we reassign the id back to the appropriate element
		update_url.prototype.mod_url = function(id) {
			var hash = id;
			hash = hash.replace( /^#/, '' );
			var fx, 
				node = $( '#' + hash );
			if ( node.length ) {
				fx = $( '<div></div>' )
					.css({
						position:'absolute',
					    visibility:'hidden',
					    top: $(window).scrollTop() + 'px'
					 })
					 .attr( 'id', hash )
					 .appendTo( document.body );
					  node.attr( 'id', '' );
				}
			document.location.hash = hash;
			if ( node.length ) {
				fx.remove();
				node.attr( 'id', hash );
			}
		 }
		
		// we create a new instance of the 'update_url' JS "class" and pass the css
		// selector 'default_tabs'
		var testing = new update_url('default_tabs');
	})();
});

