title: Get only visible element using pure javascript
body: <p>I have elements like below</p>
  
  <pre><code>&lt;div class="one"&gt;send Message&lt;/div&gt;
  
  &lt;div class="one"&gt;send Message&lt;/div&gt;
  
  &lt;div class="one"&gt;send Message&lt;/div&gt;
  </code></pre>
  
  <p>I have a web page where there is send Message buttons like above, in which only one button is visible at a time.Other two buttons are hidden via some javascript codes.So for example if 2nd button is visible , I should be able to get only that element.</p>
  
  <p>So my code will be something like </p>
  
  <pre><code>document.querySelector(".one:visible");
  </code></pre>
  
  <p>In jquery the code is <code>$(".one:visible");</code> , which works fine , But I need to know how to do this via pure javascript.</p>