javascript - jQuery function for several similar functions -

i use jquery-circle-progress plugin draw round progress bars website.

now, in case 'some' eight, have 8 pretty huge definitions of each progress bar.

now wondered if possible break down smaller code snippet. once write configuration code variables function , add values 8 different progress bars.

but how work if several variables needed?

here code of 1 of progress bars:

var e = $('.element1'),     inited_e = false;  e.circleprogress({   value: 0,   size: size });  e.appear(   { force_process: true } );  e.on('appear', function() {   if (!inited_e) {     e.circleprogress({       value: 0.85,       size: size,       linecap: "round",       fill: {         gradient: ["#00c853", "#00e676"]       }     });      inited_e = true;    }  }); 

so, variable in configuration? first of element on script relies, e change each element. furthermore, every element have value , gradient. need each function iterates through object (?!) associates value , fill 8 different progress bars.

you can refactor code :

var conf={       size: size,       linecap: "round",       fill: {         gradient: ["#00c853", "#00e676"]       }     }; 

then :

function circlify(selector,value){       conf.value=value; //override value each element       var e = $(selector),inited_e = false;        e.circleprogress({value: 0, size: size});        e.appear({ force_process: true });        e.on('appear', function() {              if (!inited_e) {                e.circleprogress(conf); // here set conf object                  inited_e = true;          }          });  } 

then , use api :

circlify('#element1',0.75); circlify('#element2,#element3',0.5);