JSFiddle - React, Tailwind, and code Playground

by Santosh Thakur

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<div id='myDiv'>
  we can use following code we can use following code
</div>

<div id="demo"></div>

CSS

#myDiv {
  padding: 20px;
  background: #fff;
  border: 1px solid red;
  width: 400px;
  display: block;
}

JavaScript

$(function() {
  $("#myDiv").click(function(e) {
    e.stopPropagation();
  });
  $(document).click(function() {
    $("#myDiv").hide();
  });
})();


var fruits, text, fLen, i;
fruits = ["Banana", "Orange", "Apple", "Mango"];
fLen = fruits.length;
text = "<ul>";
for (i = 0; i < fLen; i++) {
  text += "<li onclick='liClick()'>" + fruits[i] + "</li>";
};

text += "</ul>";

document.getElementById("demo").innerHTML = text;

function liClick() {
  alert(0);
}