jQuery Hello Goodbye

<script src="http://code.jquery.com/jquery-latest.js"></script>

<script>

$(document).ready(function(){

    $(".notice").fadeOut("slow");

    $("button").click(function () {

        $(".notice").fadeIn("slow");

        $(".notice").fadeOut("slow");

    });    

});

</script>

<style>

html { height: 100%; margin-bottom: 1px; }

.basic, .notice { padding: .8em; margin-bottom: 1em; border: 2px solid #dddddd; }

.notice { background: #FFF6BF; color: #817134; border-color: #FFD324; }

</style>

<div id="main">

    <button>Click Me!</button>

    <div class="basic" style="position:relative; width:550px;height:150px;" >

      <div class="notice" style="position:absolute; top:10px;left:10px;width:450px;">

          <p>Hello</p>

          <p>Goodbye</p>

      </div>

    </div>

    end

</div>

click here to see it in action.