JSFiddle - React, Tailwind, and code Playground

by henser

HTML

<div data-role="tabs" id="tabs" >
  <div data-role="navbar">
    <ul>
      <li><a id="type" href="#one" data-ajax="false">1</a></li>
      <li><a id="moth" href="#two" data-ajax="false">2</a></li>
      <li><a id="status" href="#five" data-ajax="false">3</a></li>
       <li><a id="add" href="#three" data-ajax="false">4</a></li>
    </ul>
  </div>
    
   <div id="five" class="ui-body-d ui-content">
    <ul data-role="listview" >
        <li><a onclick="callfilter('<?php echo $curpages.'&status=ממתין לטיפול' ?>')" data-transition="slide">ממתין לטיפול</a></li>
        <li><a onclick="callfilter('<?php echo $curpages.'&status=טופל' ?>')" data-transition="slide">טופל</a></li>
        <li><a onclick="callfilter('<?php echo $curpages ?>')" data-transition="slide">הכל</a></li>
    
    </ul>
  </div>        
  <div id="one" class="ui-body-d ui-content">
    <ul data-role="listview" >
        <li><a onclick="callfilter('<?php echo $curpagem.'&type=type 1' ?>')" data-transition="slide">type 1</a></li>
        <li><a onclick="callfilter('<?php echo $curpagem.'&type=type 2' ?>')" data-transition="slide">type 2</a></li>
        <li><a onclick="callfilter('<?php echo $curpagem ?>')" data-transition="slide">בטל</a></li>
        
    
       
    </ul>
  </div>
  <div id="two">
    <ul data-role="listview" data-inset="true">
        <li><a onclick="callfilter('<?php echo $curpaget.'&month=1' ?>')" data-transition="slide">1</a></li>
        <li><a onclick="callfilter('<?php echo $curpaget.'&month=2' ?>')" data-transition="slide"">2</a></li>
        <li><a onclick="callfilter('<?php echo $curpaget.'&month=3' ?>')" data-transition="slide">3</a></li>
        <li><a onclick="callfilter('<?php echo $curpaget.'&month=4' ?>')" data-transition="slide">4</a></li>
        <li><a onclick="callfilter('<?php echo $curpaget.'&month=5' ?>')" data-transition="slide">5</a></li>
        <li><a onclick="callfilter('<?php echo $curpaget.'&month=6' ?>')" data-transition="slide">6</a></li>
       ...

CSS

#one > ul{
    display:none;
}

JavaScript

$(function(){
    $('[href="#one"]').click(function(){
        $('#one > ul').css('display','block');
    });
});