title: JQuery Hide on page load with 'starts with', can't unhide later
body: <p>I want to hide a div when I load the page. Its a dynamic div though that gets assigned a class name, and then a number is added based on other criteria.</p>
  
  <p>So I have this.</p>
  
  <pre><code>$(function() {
    $("[class^='myClass']").hide();
  });
  </code></pre>
  
  <p>Problem is, later, when I try to show the div, I only want to show one of them. So I try this.</p>
  
  <pre><code>$(document).ready(function() {
    $("[class^='showDiv']").click(function() {
      // I use the showDiv value (array index) to get the specific
      //  class I need to now show
  
      $(".myClass2").show();
  
    });
  });
  </code></pre>
  
  <p>Problem is, it doesn't show my class.  I think its because the 'hide' function is hiding everything starting with 'myClass'.  And it kind of overrides when I try to show the specific '.myClass2' since it is being hidden by the earlier hide.</p>
  
  <p>I can't unset the hide though. otherwise all of the elements show up.</p>
  
  <p>I'm lost what to do here.</p>
  
  <p>Thanks.</p>
  
  <p>EDIT</p>
  
  <p>I tried this, and it works.</p>
  
  <p>instead of the just hiding at the beginning, I do this.</p>
  
  <pre><code>$(function() {
        $("[class^='myClass']").each(function( index ) {
            $(".myClass" + index).hide();
        });
  
      });
  </code></pre>
  
  <p>And that works fine. So I'm pretty sure the hiding a class from the begining with a 'wild card' is what my problem is..</p>
  
  <p>Is there a better solution than this?</p>