Passing Html And Css To Javascript

I need to find a way to pass the visible div to javascript. This may not even be the best way to accomplish what I'm trying to accomplish, so I'm open for other suggestions. All my

Solution 1:

Each HTML element in JS has style property. You can read and change element style by calling for example

document.getElementById('id').style.display

So you don't need to pass anything to JS, it's already there.

Solution 2:

By reading your question it sounds like you need to identify which of your divs is the visible one. The easiest way to do that is add a class to all your divs with content, you can then use document.getElementsByClassName() to get a list of them and loop through to find which one is visible one based on a display property of block.

<div class="content" style="display: none";>a</div>
<divclass="content"style="display: block;">b</div><divclass="content"style="display: none";>c</div><divclass="content"style="display: none";>d</div><divclass="content"style="display: none";>e</div>var elements = document.getElementsByClassName("content");

for(i = 0; i < elements.length; i++) 
{
     if (elements[i].style.display == 'block')
     {
          // elements[i] = this is the visable div alert('This elements[i] has a display of block; contents =  ' + elements[i].innerText);  
     }
}

The above script will output/alert 'b' as it is the visible div found. Fiddle link