JSFiddle - React, Tailwind, and code Playground

by ryanrolds

HTML

<ul>
<li class="dropdown">text</li>
<li>text</li>
<li>text</li>
<li>text</li>
<li>text</li>
<li class="dropdown">text</li>
<li>text</li>
<li>text</li>
<li class="dropdown">text</li>
<li>text</li>
<li>text</li>
<li>text</li>
</ul>

CSS

li {display:none;}
li.dropdown {display:block;}

JavaScript

$(document).ready(function() {
    $("li.dropdown").click(function() {
        var sibling = this.nextSibling;
        while(true) {
            console.log(sibling);                 
            if($(sibling).hasClass("dropdown"))
                break;
                    
            console.log(sibling.tagName);
            if(sibling.tagName == "li")
                $(sibling).show();
          
            sibling = sibling.nextSibling;            
        }                 
    });    
});