Toggle visibility with click on original element or another element
<p>So I have a function that makes an element visible when called:</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>function toggle_visibility(id) {
  var e = document.getElementById(id);
  if (e.style.display == 'block')
    e.style.display = 'none';
  else
    e.style.display = 'block';
}</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;a class="button" href="#" onclick="toggle_visibility('first');"&gt;Button&lt;/a&gt;
&lt;a class="url" id="first" href="#"&gt;First&lt;/a&gt;
&lt;a class="button" href="#" onclick="toggle_visibility('second');"&gt;Button2&lt;/a&gt;
&lt;a class="url" id="second" href="#"&gt;Second&lt;/a&gt;</code></pre>
</div>
</div>
</p>

<p>And that works, but what I want is for an element to toggle off if I use the function for a different id.  So if I first toggle on #first but then toggle on #second I want #first to toggle off.</p>