The Rapheal script seems to be too long.  Is there any option to make it shorter ?I think loop can make this script smaller.  Does anyone have good suggestions or advice?http://jsfiddle.net/sweetmaanu/Ta8mR/5/Here is the long script :var barTitle = { font-size: 9};var svgWidth = 480;var svgHeight = 300;var safety02 = new Raphael('safety02-mobile', 'svgWidth', 'svgHeight');safety02.setViewBox(-30, 0, svgWidth, svgHeight, false); //falsesafety02.setSize('100%', '100%');// Create options object that specifies the rectanglevar safetyBar1_1 = { width:30, height:150, x:60,y:50};var safetyBar1_2 = { width:30, height:130, x:90,y:70};var safetyBar2_1 = { width:30, height:165, x:140, y:35};var safetyBar2_2 = { width:30, height:100, x:170, y:100};var safetyBar3_1 = { width:30, height:130, x:220,y:70};var safetyBar3_2 = { width:30, height:65, x:250,y:135};var safetyBar4_1 = { width:30, height:120, x:300, y:80};var safetyBar4_2 = { width:30, height:100, x:330, y:100};var rect1_1 = safety02.rect(safetyBar1_1.x, 200, safetyBar1_1.width, 0).attr({fill: '#F6A01A', stroke:'#000'});var rect1_2 = safety02.rect(safetyBar1_2.x, 200, safetyBar1_2.width, 0).attr({fill: '#CCC', stroke:'#000'});var rect2_1 = safety02.rect(safetyBar2_1.x, 200, safetyBar2_1.width, 0).attr({fill: '#F6A01A', stroke:'#000'});var rect2_2 = safety02.rect(safetyBar2_2.x, 200, safetyBar2_2.width, 0).attr({fill: '#CCC', stroke:'#000'});var rect3_1 = safety02.rect(safetyBar3_1.x, 200, safetyBar3_1.width, 0).attr({fill: '#F6A01A', stroke:'#000'});var rect3_2 = safety02.rect(safetyBar3_2.x, 200, safetyBar3_2.width, 0).attr({fill: '#CCC', stroke:'#000'});var rect4_1 = safety02.rect(safetyBar4_1.x, 200, safetyBar4_1.width, 0).attr({fill: '#F6A01A', stroke:'#000'});var rect4_2 = safety02.rect(safetyBar4_2.x, 200, safetyBar4_2.width, 0).attr({fill: '#CCC', stroke:'#000'});var p1title = safety02.text(0, 110, Percentage (%)).rotate(-90);var unicorn = safety02.path(M400 200 H40 V10).attr({stroke: #000,stroke-width: 1});var s1firstBar = safety02.text(90, 210, Headache).attr(barTitle);var p1thirdBar = safety02.text(250, 210, Nausea).attr(barTitle);var p1firstBar = safety02.text(165, 210, Diarrhoea).attr(barTitle);var p1thirdBar = safety02.text(330, 215, Abdminal \n pain).attr(barTitle);var anim1_1 = Raphael.animation({y:safetyBar1_1.y,height:safetyBar1_1.height}, 2000);var anim1_2 = Raphael.animation({y:safetyBar1_2.y,height:safetyBar1_2.height}, 2000);var anim2_1 = Raphael.animation({y:safetyBar2_1.y,height:safetyBar2_1.height}, 1000);var anim2_2 = Raphael.animation({y:safetyBar2_2.y,height:safetyBar2_2.height}, 1000);var anim3_1 = Raphael.animation({y:safetyBar3_1.y,height:safetyBar3_1.height}, 2000);var anim3_2 = Raphael.animation({y:safetyBar3_2.y,height:safetyBar3_2.height}, 2000);var anim4_1 = Raphael.animation({y:safetyBar4_1.y,height:safetyBar4_1.height}, 1000);var anim4_2 = Raphael.animation({y:safetyBar4_2.y,height:safetyBar4_2.height}, 1000);rect1_1.animate(anim1_1);rect1_2.animate(anim1_2.delay(300));rect2_1.animate(anim2_1);rect2_2.animate(anim2_2.delay(300));rect3_1.animate(anim3_1);rect3_2.animate(anim3_2.delay(300));rect4_1.animate(anim4_1);rect4_2.animate(anim4_2.delay(300));$('#viewFreqFirst-big').click(function(){    rect1_1.animate({y:80,height:120}, 1500);    rect1_2.animate({y:100,height:100}, 1500);    rect2_1.animate({y:105,height:95}, 1500);    rect2_2.animate({y:115,height:85}, 1500);    rect3_1.animate({y:140,height:60}, 1500);    rect3_2.animate({y:160,height:40}, 1500);    rect4_1.animate({y:120,height:80}, 1500);    rect4_2.animate({y:140,height:60}, 1500);});$('#viewFreqSecond-big').click(function(){    rect1_1.animate({y:safetyBar1_1.y,height:safetyBar1_1.height}, 1500);    rect1_2.animate({y:safetyBar1_2.y,height:safetyBar1_2.height}, 1500);    rect2_1.animate({y:safetyBar2_1.y,height:safetyBar2_1.height}, 1500);    rect2_2.animate({y:safetyBar2_2.y,height:safetyBar2_2.height}, 1500);    rect3_1.animate({y:safetyBar3_1.y,height:safetyBar3_1.height}, 1500);    rect3_2.animate({y:safetyBar3_2.y,height:safetyBar3_2.height}, 1500);    rect4_1.animate({y:safetyBar4_1.y,height:safetyBar4_1.height}, 1500);    rect4_2.animate({y:safetyBar4_2.y,height:safetyBar4_2.height}, 1500);    });
How to shorten the JavaScript in Raphal?
javascript;jquery;raphael.js