toggleClass not working as expected

I’m trying to create a dropdown using CSS, HTML, and Jquery and I want to activate the dropdown when clicked by using toggleClass. It should toggle class to ‘active’ which should, according to the css, "transform: perspective(1000px) rotateX(0deg); " essentially making it dropdown when clicked, and viceversa. Please let me know what I’m missing to make it work.

 <body style="background-color:white;">
     <div class="dropdown">
	        <li><a href="helpform.html">Help Request</a></li>
	        <li><a href="feedback_form.html">Feedback Form</a></li>
     <script src=""></script>
	 <script type="text/javascript">


    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    position: relative;
    width: 200px;
    height: 60px;
    font-size: 24px;
    background: #27AE60;
    color: #FFFFFF;
    border: none;
    box-shadow: none;
    cursor: pointer;
    outline: none;
    position: absolute;
    margin: 0;
    padding: 0;
    width: 100%;
    transform-origin: top;
    transform: perspective(1000px) rotateX(-90deg);
    transition: 0.5s;
    transform: perspective(1000px) rotateX(0deg);
ul li
    list-style: none;
ul li a
    display: block;
    padding: 10px;
    text-align: center;
    text-decoration: none;
    background: #212F3D;
    color: #FFFFFF;
    border-bottom: 1px solid rgba(0,0,0,.2);
    transition: 0.5s;
ul li a:hover
    background: #27AE60

I’ve edited your post for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

See this post to find the backtick on your keyboard. The “preformatted text” tool in the editor (</>) will also add backticks around text.

Note: Backticks are not single quotes.


@Covedog When I test your code, it seems to be working fine. When the page loads, I see:

When I click the button, the dropdown transitions to be:


When I click the button again, the dropdown transitions back to hidden.

What do you see when clicking on the button? Do you see any errors in your browser’s console?