I am a newbie in javascript/jQuery. 

I have an html file with a div, containing a button, that should be hidden at the document load and will be displayed by clicking on a link.

The problem is that after displaying of the div, the entire div is clickable. To be precise, it is a link to the same page. I used different values for the display property of div, e.g. block, inline, inline-block, but the problem persists.

The other problem (that seems to be related to the first problem) is that the button click does not work.

It is the body part of my file:

```
<body>
    <section>
        <header><h1>Welcome!</h1></header>
        <nav>
            <ul>
                <li id="viewER"><a href="#">View an ER Diagram</li>         
            </ul>
        </nav>
    </section>
    <div id="diaSelect">
        <p>Choose a diagram:</p> 
        <p>
        <select id="sel">
        </select>
        </p>
        <p>
        <button id="show" type="button"></button>
        </p>
    </div>

    <script>
        $(document).ready(function(){

            $("#viewER a").click(function() {
                    if ($("#diaSelect").is(':hidden'))
                        $("#diaSelect").css('display', 'inline-block'); 
                    $("#diaSelect").find('option').remove();
                    listModelFiles();
                    $("#show").text("View");
            });

            $("#diaSelect").css('display', 'none');

            $("show").on("click", function(){
               ...
            });

        });                     
    </script>
</body>  

```

listModelFiles() adds options to the select.