jquery - Turning DOM element into JavaScript class with all it's inheritances -

i've been searching hours , found nothing.

i'm making set of premade elements (similar bootstrap has) , want animations of these elements handled jquery , javascript.

all these elements have names: dframe, dcategory, dbutton , dpanel. i've created set of classes in javascript, along functions such onclick, onload, onhover etc.

now issue quite simple - want every dom element of aforementioned classes turned javascript class, inherits functions , executing function on element (elem.dofunc()) work.

i've tried:

document.getelementsbyclassname( "dbutton" )[0] = new dbutton(); 

for obvious reasons resulted in: 'elem.test() not defined function' or along these lines.

thanks help!

@edit: here's example, maybe that'll make bit clearer:

function initialize() {   document.getelementsbyclassname( "dbutton" )[0] = new dbutton();   document.getelementsbyclassname( "dbutton" )[0].test(); } document.addeventlistener( 'domcontentloaded', initialize, false );  /*       classes */  class dframe {  }  class dcategorylist {  }  class dbutton {   test()   {     console.log( "shows, output, etc" );   } } 

i going take stab @ saying dom elements aren't javascript objects. set dom element equal javascript instance equivalent setting car equal instance of justice.