title: JavaScript Error: Unable to get property 'style' of undefined or null reference
body: <p>I am trying to build a website that navigates through image galleries. When I click the previous or next button I am getting an error code that reads: 'Error: Unable to get property 'style' of undefined or null reference'. Can anyone tell me why this is happening? Thanks for any help!</p>
  
  <p>Here is my JavaScript code:</p>
  
  <pre><code>window.onload = showImage(imgName);
  
  function showImage(imgName) 
  {
      var largeImg = document.getElementById("large");
      var thePath = "images/";
      var theSource = thePath + imgName;
  
      largeImg.src = theSource;
      largeImg.alt = imgName;
  
  }
  
  var currentIndex = 0;
  function nextGall()
  {
      var gallery = new Array();
      gallery = document.getElementsByClassName("gall");
  
      if(currentIndex &gt;= gallery.length)
      {
          currentIndex = gallery.length - 1;
          document.getElementById("next").src = "images/nextEnd.jpg";
      }
  
      if (currentIndex &gt; 0)
      {
          document.getElementById("previous").src = "images/previous.jpg";
      }
  
      currentIndex +=1;
  
      for (var x = 0; x &lt; gallery.length; x++)
      {
          gallery[x].style.display = "none";
      }
  
      gallery[currentIndex].style.display = "block";
      return false;
  }
  
  function prevGall()
  {
  
      var gallery = document.getElementsByClassName("gall");
      currentIndex -= 1;
  
      if(currentIndex &lt;= 0)
      {
          currentIndex = 0;
          document.getElementById("previous").src = "images/previousEnd.jpg";
      }
  
      if(currentIndex &lt; gallery.length)
      {
          document.getElementById("next").src = "images/next.jpg";
      }
  
      for (var x = 0; x &lt; gallery.length; x++)
      {
          gallery[x].style.display = "none";
      }
  
      gallery[currentIndex].style.display = "block";
      return false;   
  } 
  </code></pre>