toggleClass() with next() does not work Jquery

Corentin Branquet

I've this code :

<ul class="mobile">
     <li>
        link 1
        <span>></span>
        <ul class="submenu">
           <li></li>
           <li></li>
        </ul>
     </li>
     <li>
        link 2
        <span>></span>
        <ul class="submenu">
           <li></li>
           <li></li>
        </ul>
     </li>
     <li>
        link 3
        <span>></span>
        <ul class="submenu">
           <li></li>
           <li></li>
        </ul>
     </li>
  </ul>


$('.mobile > li > span').click(function(event) {
    event.preventDefault();
    $(this).next('.submenu').toggleClass('active');
});

What I want to do is to toggle a class called "active" when I click on the span but it does not work.

Thanks for your help !

Mr Singh

$('.mobile > li > span').click(function(event) {
    $(this).next('ul').toggleClass('main');
});

.main {
    font-size: 120%;
    color: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="mobile">
     <li>
        link 1
        <span>>Click Me</span>
        <ul class="submenu">
           <li>hello</li>
           <li>hello</li>
        </ul>
     </li>
     <li>
        link 2
        <span>>click me</span>
        <ul class="submenu">
           <li>hello </li>
           <li>hello</li>
        </ul>
     </li>
     <li>
        link 3
        <span>>Click me</span>
        <ul class="submenu">
           <li>hello </li>
           <li>hello</li>
        </ul>
     </li>
  </ul>

Collected from the Internet

Please contact [email protected] to delete if infringement.