Jquery。单击显示/隐藏

嗨，我正试图隐藏一个表单，点击发送按钮时会显示一条消息。我在document.ready函数中尝试了很多方法，但这似乎会导致比修复的错误更多的错误。这就是代码目前的状态

                    <form class="contact">
                    <p class="contact-name">
                        <label class="contact-author">Name*</label>
                        <input class="input-name" type="text" name="name" placeholder="Your name"><br>
                    </p>
                    <p class="contact-email">
                        <label class="contact-author">Email*</label>
                        <input class="input-email" type="email" name="email" placeholder="Email Address"><br>
                    </p>
                    <p class="contact-msg">
                        <label class="contact-author">Message*</label>
                        <textarea class="input-msg" type="text" name="comments" maxlength="1000" placeholder="Enter your message"></textarea><br>
                    </p>
                    <p class="contact-send">
                        <input class="input-send" id="send" type="submit" value="Send" name="submit">
                    </p>
                </form>
                        <div id="send-msg" style="visibility:hidden;">
                            <p>Thanks your message has been sent!</p>
                        </div>


$('#send').click(function() {
$('.contact').hide();
$('#send-msg').show();
)};

名字*




电子邮件*




信息*





谢谢你的信息已经发送

$（“#发送”）。单击（函数（）{
$（'.contact'）.hide（）；
$（“#发送消息”）.show（）；
)};

JSFiddle- 有几件事：

你忘了把jQuery包括在你的小提琴里

您的结束语

）}

实际上应该是

}）

当使用CSS隐藏元素时，使用

display:none

---

更新的提琴：

Aha感谢道歉将在我再次感谢时投票作为答案！