css - border of one div to be the color of another with javascript -

i have form , several divs in it. matter is, color of 1 div set javascript, randomly, , border of div has in 1 color first one. gets more complicated, because several divs have 1 class names. basically, mean here 1 house should of 1 color, , "roof" depends on content, color of set randomly js. worked on quite long time, seem have no solution(

i guess, javascript should this

document.getelementbyclassname("roof").style.border-bottom-color = document.getelementbyclassname("contents").style.background-color; 

my jfiddle html , css

if you'd keep "pure" js, take on approach:

document.getelementsbyclassname("roof")[0].style.borderbottomcolor =   getstyle(document.getelementsbyclassname("contents")[0], 'backgroundcolor');  function getstyle(el,styleprop) {     if (el.currentstyle)         return el.currentstyle[styleprop];      return document.defaultview.getcomputedstyle(el,null)[styleprop]; } 

please notice, getelementsbyclassname returns set of elements have given class names. access of them , fill in elements border ramdom color can advice go in loop throuth them like:

var yourelements = document.getelementsbyclassname('classname'); for(var i=0; i<yourelements.length; i++) {    yourelements[i].style.bordercolor= "#random_color"; } 

advanced technique use jquery, , correct answer given above justanil.

hope helps. cheers!