JSFiddle - React, Tailwind, and code Playground

HTML

<script>
    
    function mob() {
        
        document.getElementById('mobi').style.display = "block";
    }
    function mob1() {
        
        document.getElementById('mobi1').style.display = "block";
    }
</script>

<div class="postleftmen">
    <ul class="cbp-vimenu">
        <li><a href="#" onClick="mob();">Click</a></li>
        <li><a href="#" onClick="mob1();">Click1</a></li>
        <li><a href="#" onClick="clear();">Clear</a></li>
    </ul>
    </div>
    <div class="dis123">
        display
        <div 
            id="mobi"
            style="display:none;z-index:99;" 
            class="answer_list" > 
                hjkhjkhjkhjkh
        </div>
                <div 
            id="mobi1"
            style="display:none;z-index:99;" 
            class="answer_list1" > 
                1hjkhjkhjkhjkh
        </div>
    </div>

CSS

body {position: relative;font-family: 'Lato', Calibri, Arial, sans-serif;    color: #47a3da;}
        body, html { font-size: 100%; height: 100%; padding: 0; margin: 0;}
        a {color:#f0f0f0;text-decoration: none;}
        a:hover {color: #000;}
        #header{height: 90px;width: 100%;background-color: #B9F5BB;}
        #footer{height: 50px;width: 100%;background-color: #FDD5CB;}
        .dis123{width:75%;float:left; height: 500px;background-color:#DCEEE3; text-align: left; }
        .postleftmen{width:25%;float:left;}