I have a script when the button is clicked. An image will pop up..

And I want to have multiple buttons and multiple images but same div to have same animation on script. 

But the problem is, the script only work on just 1 button.

And it doens't show the image.

HTML CODE

```
<button id="LearnMoreBtn">Learn More</button>
<div id="overlay"></div>
<div id="popup">
<div id="PopUpText">Popup contents here</div>
<button id="CloseBtn">Close</button>
</div> </div>

<div id="img2">
<button id="LearnMoreBtn">Learn More</button>
<div id="overlay"></div>
<div id="popup" img src="newfinal/images/portfolio6.jpg"> 
<div id="PopUpText">Popup contents here</div>
<button id="CloseBtn">Close</button>
</div> </div>

<div>
some other content that will be behind the popup
</div>

```

Javascript Code

```
    window.onload = function() {
    document.getElementById("LearnMoreBtn").onclick = function(){
    var overlay = document.getElementById("overlay");
    var popup = document.getElementById("popup");
    overlay.style.display = "block";
    popup.style.display = "block";
    };

    document.getElementById("CloseBtn").onclick = function(){
    var overlay = document.getElementById("overlay");
    var popup = document.getElementById("popup");
    overlay.style.display = "none";
    popup.style.display = "none";      
    }
    };

```

Here's the demo..

<http://jsfiddle.net/j4c7U/>