JSFiddle - React, Tailwind, and code Playground
HTML
<div class="block" id="0" name="0">
<div class="block_header">
<div class="block_name">Main</div>
<div class="block_acts">
<button class="reduct">Редактировать</button><br />
<button class="remove">Удалить</button>
</div>
</div>
<div class="block_text" style="display:none"></div>
</div>
JavaScript
$("div.block_name").click(function() {
var elem = this;
if ($(this).parent("div.block_header").next("div.block_text").css("display") == "none") {
$.ajax({
type : 'post',
url: "/echo/html/",
data : { html: "ID-"+$(this).parents("div.block").attr("id") },
dataType: "html",
success: function(html) {
$(elem).parent("div.block_header").next("div.block_text").text(html).slideDown("slow");
},
});
} else {
$(this).parent("div.block_header").next().slideUp("slow").empty();
}
});
$("button.reduct").click(function() {
var elem = this;
if ($(this).parents("div.block_header").next("div.block_text").css("display") == "none") {
$(elem).parents("div.block_header").children("div.block_name").click();
}
});