Adding close button in div to close the box

Question

I have created a URL preview box for the entered URL.

Preview is shown in the div box. I want to add a close option on the right top. How could be done so that when u

Answer 1

Here's the updated FIDDLE

Your HTML should look like this (I only added the button):

    close
    

         
        
the title will go here
        
 www.myurlwill.com 
        

        this is a short description yada yada peanuts etc this is a short description yada yada peanuts etc this is a short description yada yada peanuts etc this is a short description yada yada peanuts etcthis is a short description yada yada peanuts etc 
        
    

and you should add the following CSS:

.fragment {
    position: relative;
}
#closeButton {
    position: absolute;
    top: 0;
    right: 0;
}

Then, to make the button actually work, you should add this javascript:

document.getElementById('closeButton').addEventListener('click', function(e) {
    e.preventDefault();
    this.parentNode.style.display = 'none';
}, false);

We're using e.preventDefault() here to prevent the anchor from following the link.