JSFiddle - React, Tailwind, and code Playground

by kiokotzu

HTML

<div class="select">desplegar</div>
<ul>
    <li>opción 1</li>
    <li>opción 2</li>
    <li>opción 3</li>
    <li>opción 4</li>
</ul>

CSS

.select{width:150px; padding:10px; background:green; color:#fff;}
ul{list-style:none; padding:0; display:none;}
ul li{width:150px; padding:10px; margin:5px 0 0 0; background:blue; color:#ccc;}
.activo{ background:yellow;}

JavaScript

$(document).ready(function(){
    $('.select').click(function(){
        $('ul').slideDown();
    });
    $('ul li').click(function(){
        var valor = $(this).text();
        $('.select').html(valor);
        $('ul').slideUp();
    });
});