JSFiddle - React, Tailwind, and code Playground

by mahmuutt

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<div id="div1">
  <input type="text" id="txt" placeholder="isminiz">
  <button type="submit" id="button">Giris</button>
  <br>
  <hr>
  <b id="bolttext">MERHABA.!</b>
  <button type="button" id="button2">yaziyi saydamlastir</button>
</div>
<div id="div2">
  <ol>
    <li>Eski Nesneler</li>
    <li>Eski Nesneler</li>
    <li>Eski Nesneler</li>
  </ol>
  <button type="button" id="button3">Yeni Nesne Ekle</button>
</div>
<div id="div3" class="Yazi" >Buraya Tikla</div>
<div id="div4" class="Acilan Yazi" style="display: none;">Acilan Yazi</div>

JavaScript

$("#button").click(function() {
  alert("Selamün Aleyküm," + $("#txt").val())
})

$("#txt").focus(function() {
  $(this).css("background-color", "#fac");
})

$("#button2").click(function() {
  $("#bolttext").fadeTo(0.5, 0.6);
})

$("#button3").click(function() {
  $("ol").append("<li>Sona Yeni Nesne</li>");
  $("ol").css("color", "#1a63f3")
  var txt1 = "<li>Basa Yeni Nesne</li>";
  $("#div2 ol").prepend(txt1)
})

$("#div3").click(function(){
	$("#div4").slideDown(1000);
  $("#div4").slideUp(1000);
})