title: Jquery fadeOut function not properly working sometimes
body: <p>I have three image gallerys that are hidden when you start a web page. I have put fadeIn and fadeOut functions on them when you click the button. When I click on 1st gallery, then on 2nd and on 3rd it works perfectly, but when I want to go back from 3rd to 2nd or 2nd to 1st and so on, my pictures just disappear without fading out. Can you help me with my code ? 
  HTML :</p>
  
  <pre><code>&lt;section id="proteini"&gt;
            &lt;h1&gt;Galerija naših proizvoda&lt;/h1&gt;
            &lt;article&gt;
              &lt;h2&gt;Odein&lt;/h2&gt;
              &lt;button id="gumb1" onclick="proteini_slike()"&gt;Prikaži!&lt;/button&gt;
            &lt;/article&gt;
            &lt;article&gt;
              &lt;h2&gt;Krethor&lt;/h2&gt;
              &lt;button id="gumb2" onClick="kreatini_slike()"&gt;Prikaži!&lt;/button&gt;
            &lt;/article&gt;
            &lt;article&gt;
              &lt;h2&gt;L-Yggdrasil&lt;/h2&gt;
              &lt;button id="gumb3" onClick="carnetin_slike()"&gt;Prikaži!&lt;/button&gt;
            &lt;/article&gt;
          &lt;/section&gt;
          &lt;section id="kreatini"&gt;
            &lt;img id="protein1" src="pictures/placeholder2.jpg"&gt;
            &lt;img id="protein2" src="pictures/placeholder3.jpg"&gt;
  
            &lt;img id="kreatin1" src="pictures/placeholder2.jpg"&gt;
            &lt;img id="kreatin2" src="pictures/placeholder3.jpg"&gt;
  
            &lt;img id="carnetin1" src="pictures/placeholder2.jpg"&gt;
            &lt;img id="carnetin2" src="pictures/placeholder3.jpg"&gt;
  &lt;/section&gt;
  </code></pre>
  
  <p>CSS :</p>
  
  <pre><code>#protein1 {
    width:45%;
    display: none;
    margin-top:50px;
    margin-right:5%;
    margin-left:2.5%;
  }
  
  #protein2 {
    width: 45%;
    display:none;
    margin-top:50px;
  }
  </code></pre>
  
  <p>note* All other pictures are set like those above
  Jquery : </p>
  
  <pre><code>$('#gumb1').click(function(e){
      $('#kreatin1').fadeOut();
      $('#kreatin2').fadeOut();
      $('#carnetin1').fadeOut();
      $('#carnetin2').fadeOut();
      $('#protein1').delay(100).fadeIn(2000);
      $('#protein2').delay(100).fadeIn(2000);
    });
  
    $('#gumb2').click(function(e){
      $('#protein1').fadeOut();
      $('#protein2').fadeOut();
      $('#carnetin1').fadeOut();
      $('#carnetin2').fadeOut();
      $('#kreatin1').delay(100).fadeIn(2000);
      $('#kreatin2').delay(100).fadeIn(2000);
    });
  
    $('#gumb3').click(function(e){
      $('#kreatin1').fadeOut();
      $('#kreatin2').fadeOut();
      $('#protein1').fadeOut();
      $('#protein2').fadeOut();
      $('#carnetin1').delay(100).fadeIn(2000);
      $('#carnetin2').delay(100).fadeIn(2000);
    });
  </code></pre>