title: change visibility of span using jquery
body: <p>I work on a durandal project.
  I have span and button elements in html.
  The span elements are hidden and I want to show these on button click.
  My problem is that when I hide the span from html- it can't show it from javascript.
  I saw this question (on link <a href="https://stackoverflow.com/questions/17864617/change-visibility-of-label-tag-using-jquery">change visibility of label tag using jquery</a>) and I tried all of the answers- nothing helped me.</p>
  
  <p>(I tried using:
    <strong>in html:</strong></p>
  
  <pre><code>&lt;span id="mySpan" hidden = "hidden"&gt;aaa&lt;/span&gt;
  </code></pre>
  
  <p>or:</p>
  
  <pre><code>&lt;span id="mySpan" style= "visibility:collapse"&gt;aaa&lt;/span&gt;
  </code></pre>
  
  <p>or:</p>
  
  <pre><code>&lt;span id="mySpan" style= "display:none"&gt;aaa&lt;/span&gt;
  </code></pre>
  
  <p><strong>in javascript:</strong></p>
  
  <pre><code>$("#mySpan").show();
  </code></pre>
  
  <p>or:</p>
  
  <pre><code>$("#mySpan").css('visibility', 'visible');
  </code></pre>
  
  <p><strong>I tried all of the optional combinations</strong>
  )</p>
  
  <p><strong>Note:</strong> I want you to know that when I'm not hiding the span from the HTML, and try using <code>toggle()</code>, <code>hide()</code>, <code>show()</code> - it works well.</p>
  
  <p>Example that does not work:</p>
  
  <p>on html page:</p>
  
  <pre><code>    &lt;span id="mySpan" hidden = "hidden"&gt;aaa&lt;/span&gt;
  </code></pre>
  
  <p>on javascript page:</p>
  
  <pre><code>    $("#mySpan").show();
  </code></pre>