JSFiddle - React, Tailwind, and code Playground

HTML

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
      function MM_swapImage(){var a,b=0,c,d=MM_swapImage.arguments;document.MM_sr=new Array;for(a=0;a<d.length-2;a+=3)if((c=MM_findObj(d[a]))!=null){document.MM_sr[b++]=c;if(!c.oSrc)c.oSrc=c.src;c.src=d[a+2]}}function MM_findObj(a,b){var c,d,e;if(!b)b=document;if((c=a.indexOf("?"))>0&&parent.frames.length){b=parent.frames[a.substring(c+1)].document;a=a.substring(0,c)}if(!(e=b[a])&&b.all)e=b.all[a];for(d=0;!e&&d<b.forms.length;d++)e=b.forms[d][a];for(d=0;!e&&b.layers&&d<b.layers.length;d++)e=MM_findObj(a,b.layers[d].document);if(!e&&b.getElementById)e=b.getElementById(a);return e}function MM_preloadImages(){var a=document;if(a.images){if(!a.MM_p)a.MM_p=new Array;var b,c=a.MM_p.length,d=MM_preloadImages.arguments;for(b=0;b<d.length;b++)if(d[b].indexOf("#")!=0){a.MM_p[c]=new Image;a.MM_p[c++].src=d[b]}}}function MM_swapImgRestore(){var a,b,c=document.MM_sr;for(a=0;c&&a<c.length&&(b=c[a])&&b.oSrc;a++)b.src=b.oSrc}

                    function toogle(){
                        $("#content_div1id").toggleClass('reportselectpop reportselectpopShow');
                    }
                    
                    function oncLanguage(data){
                        $("#txtLanguage").val(data);
                        toogle();
                    }
</script>
                <div style="position:relative;">
        <div style="width: 334px;">
            <input id="txtLanguage" class="reporttextboxP" type="text" style="float: left; width: 300px;"
            value="ภาษาไทย" name="txtLanguage" readonly="">
            <div style="float: left; background-color: Black; width: 24px; height: 27px;">
                <a onmouseover="MM_swapImage('Image103','','http://logistics.nostramap.com/images/report/i_drop_ov.png',1)" onmouseout="MM_swapImgRestore()"
                onclick="toogle();">
<img id="Image103" border="0" width="24"...

CSS

.reporttextboxP {
                border: 2px solid black;
                color: #414141;
                font-family:"Swiss721BT-Bold";
                font-size: 16px;
                width: 306px;
                                height: 23px;
            }
            .reportselectpop {
                background-color: black;
                color: #FFD100;
                font-family:"Swiss721BT-Bold";
                opacity: 0.85;
                width: 302px;
                z-index: 999;
                                display: none;
            }
                        .reportselectpopShow {
                background-color: black;
                color: #FFD100;
                font-family:"Swiss721BT-Bold";
                opacity: 0.85;
                position: absolute;
                width: 302px;
                z-index: 999;
                                display: block;
            }
            .reportpoplabel {
                color: #FFFFFF;
                cursor: pointer;
                font-family:"Swiss721BT-Bold";
                font-size: 14px;
                padding-bottom: 5px;
                padding-left: 20px;
                padding-top: 5px;
            }