title: hyperlink issue dont redirect to another webpage when click on the menu
body: <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code> $(document).ready(function () {
            $('.mobile-nav-button').on('click', function() {
            $( ".mobile-nav-button .mobile-nav-button__line:nth-of-type(1)" ).toggleClass( "mobile-nav-button__line--1");
            $( ".mobile-nav-button .mobile-nav-button__line:nth-of-type(2)" ).toggleClass( "mobile-nav-button__line--2");  
            $( ".mobile-nav-button .mobile-nav-button__line:nth-of-type(3)" ).toggleClass( "mobile-nav-button__line--3");  
            
            $('.mobile-menu').toggleClass('mobile-menu--open');
            return false;
          }); 
          });</code></pre>
  <pre class="snippet-code-css lang-css prettyprint-override"><code> 
  .mobile-nav-button {
    width: 35px;
    position: absolute;
    margin: 2rem;
    right: 0;
    top: 0;
    z-index: 9999;
    cursor: pointer;
    width: 35px;
    height: 30px;
    padding-top: 2%;
  }
  
  .mobile-nav-button .mobile-nav-button__line {
    width: 100%;
    height: 4px;
    background: #0e0e0e;
    position: relative;
    transition: 1s ease;
  }
  
  .mobile-nav-button .mobile-nav-button__line:nth-of-type(2) { margin: 0.5rem 0; }
  
  .mobile-nav-button .mobile-nav-button__line--1 {
    transform: rotate(45deg);
    top: 13px;
    position: absolute;
  }
  
  .mobile-nav-button .mobile-nav-button__line--2 { display: none; }
  
  .mobile-nav-button .mobile-nav-button__line--3 {
    transform: rotate(135deg);
    top: 13px;
    position: absolute;
  }
  
  .mobile-menu {
    display: block;
    max-width: 500px;
    width: 100%;
    right: -100%;
    height: 100%;
    background: #fcb852;
    position: absolute;
    z-index: 9998;
    transition: 0.6s ease;
    top: 0;
    opacity: 0;
    max-height: 587px; /*height of  opened menu*/
  }
  
  .mobile-menu ul {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    padding: 0;
  }
  
  .mobile-menu ul li { list-style: none; }
  
  .mobile-menu ul li a {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    display: block;
    text-align: center;
    text-decoration: none;
    color: #0e0e0e;
    font-size: 3rem;
    font-weight: bold;
    overflow: hidden;
    position: relative;
  }
  
  .mobile-menu ul li a:after {
    content: '';
    background: #0e0e0e;
    width: 100%;
    height: 100%;
    position: absolute;
    right: -100%;
    top: 0;
    z-index: -1;
    transition: 0.4s ease;
  }
  
  .mobile-menu ul li a:hover { color: #fff; }
  
  .mobile-menu ul li a:hover:after { right: 0; }
  
  .mobile-menu img {
    position: absolute;
    width: 150px;
    display: block;
    left: 50%;
    top: 3rem;
    transform: translatex(-50%);
    padding: 0;
    text-align: center;
  }
  
  .mobile-menu--open {
    right: 0;
    opacity: 1;
  } 
  
  .control {
      margin-top: 10px;
      margin-right: 30px;
  }
  
  .menu{
      min-height: 100px;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;header&gt;
              &lt;div class="mobile-nav-button"&gt;
                  &lt;div class="mobile-nav-button__line"&gt;&lt;/div&gt;
                  &lt;div class="mobile-nav-button__line"&gt;&lt;/div&gt;
                  &lt;div class="mobile-nav-button__line"&gt;&lt;/div&gt;
              &lt;/div&gt;
              &lt;nav class="mobile-menu"&gt;
                  &lt;ul&gt;
                      &lt;li&gt;&lt;a href="index.php"&gt;Home&lt;/a&gt;&lt;/li&gt;
                      &lt;li&gt;&lt;a href="about1.php"&gt;About Us&lt;/a&gt;&lt;/li&gt;
                      &lt;li&gt;&lt;a href="#"&gt;What We Do&lt;/a&gt;&lt;/li&gt;
                      &lt;li&gt;&lt;a href="getinvolved.php"&gt;Get Involved&lt;/a&gt;&lt;/li&gt;
                      &lt;li&gt;&lt;a href="contactus.php"&gt;Contact Us&lt;/a&gt;&lt;/li&gt;
                  &lt;/ul&gt;
              &lt;/nav&gt;
          &lt;/header&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>hello here i have designed simple menu bar. i have some menu in it &amp; for each menu i have one web page with .php extension but when i click on the menu it wont redirect me to the another page.that means there is no operation performed when i click on menu</p>