'jquery close X on a container-fluid

I have the following:

 <div id="AreaContainer" class="container-fluid scrollBox fluidCentrePosition" style="display:none" title="Area">
                            <div>

enter image description here

The close X in the top right hand side is what I am interested in. When it is clicked it closes the container as expected. My question is how do I get 'notified' that this has occurred? I cannot get the below .close to work, where in the above 'div' line can I link to the close X?

   $('.close').click(function () {
                $('#AreaContainer').parent().hide();
                alert(".close working!");
            })

if i try to add this:

<button type="button" class="close" aria-label="Close">
  <span aria-hidden="true">&times;</span>

I get a second X in the top right which I don't want, but the ('.close').click(function () works!?

Thank you



Solution 1:[1]

In html you gave id="areaContainer" and in jquery you are using it as "#AreaContainer" capital case.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Satish Thakur