title: Hidden label does not visible
body: <p>I want to unvisible some text and visible some label. after click bottom my text will disappear but my label does not show.
  What should I do?</p>
  
  <pre><code>&lt;body&gt;
          &lt;div id="middle"&gt;
              &lt;div id="left"&gt;
              &lt;/div &gt;
              &lt;div id="m"&gt;
              Name: &lt;input type="text" name="y1"&gt;&lt;br /&gt;
              Family: &lt;input type="text" name="y1"&gt;&lt;br /&gt;
              Phone: &lt;input type="text" name="y1"&gt;&lt;br /&gt;
  
              &lt;label style="display: none "  name="y2" &gt;A &lt;/label&gt;
              &lt;label  style="display: none " name="y2" &gt;B &lt;/label&gt;
              &lt;label style="display: none " name="y2" &gt;C &lt;/label&gt;
              &lt;button  onclick="myFunction()"&gt;Hide elements&lt;/button&gt;
  
              &lt;script&gt;
              function myFunction() {
                var x = document.getElementsByName("y1");
                for (var i = 0; i &lt; x.length; i++) {
                  x[i].style.display = "none";
                }
                var x = document.getElementsByName("y2");
                for (var i = 0; i &lt; x.length; i++) {
                  x[i].style.display = "visible !important"; 
                }
              }
              &lt;/script&gt;
      &lt;/div&gt;
      &lt;/body&gt;
  </code></pre>