JSFiddle - React, Tailwind, and code Playground

by Siddharth Motwani

HTML

<table class="dynmictable">
     <tbody>
        <tr><td class="ui-droppable ui-sortable content tbledata">td1</td>
        <td class="ui-droppable ui-sortable content tbledata">td2</td>
        <td class="ui-droppable ui-sortable content tbledata">td3</td>
        <td class="ui-droppable ui-sortable content tbledata">td4fxdhnfdxhfdxhbfxdh</td>
            <td class="addtd">fdgggggggfd<img src="images/plus_td.png" class="" id="addtditem"/></td>
            </tr>
    </tbody>
    </table>

<div class="hideDiv" id="div1">some text</div>

CSS

.hideDiv{
    display:none; 
    color:red;
}

JavaScript

$(function(){
  $("td").mouseenter(function(){
   if($(this).hasClass("content"))
   {
       $("#div1").show();
   }
  });
  $("td").mouseleave(function(){
   $("#div1").hide();
  });
});