I use ASP.NET Core based CMS for my website.
What I need is to add new div tag with class button_two if tag h1 item_title has this text "Peow, Wow.".
How can I do it using ASP.NET code or using jQuery (using closest and append)?
<div class="items">
<div class="item">
<h1 class="item_title">
Any Title
</h1>
<div class="buttons">
<div class="button_one">
<input type="button" value="buy" />
</div>
</div>
</div>
<div class="item">
<h1 class="item_title">
Any Title
</h1>
<div class="buttons">
<div class="button_one">
<input type="button" value="buy" />
</div>
</div>
</div>
<div class="item">
<h1 class="item_title">
Title Peow, Wow.
</h1>
<div class="buttons">
<div class="button_one">
<input type="button" value="buy" />
</div>
</div>
</div>
<div class="item">
<h1 class="item_title">
Any Title
</h1>
<div class="buttons">
<div class="button_one">
<input type="button" value="buy" />
</div>
</div>
</div>
<div class="item">
<h1 class="item_title">
Title Peow, Wow.
</h1>
<div class="buttons">
<div class="button_one">
<input type="button" value="buy" />
</div>
</div>
</div>
</div>
You can use :contains() selector , next() and `append()'
$('h1:contains("Peow, Wow")')
.next('.buttons')
.append('<div class="button_one">BUTTON ONE</div>')
.button_one {color:red}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="items">
<div class="item">
<h1 class="item_title">
Any Title
</h1>
<div class="buttons">
<div class="button_one">
<input type="button" value="buy" />
</div>
</div>
</div>
<div class="item">
<h1 class="item_title">
Any Title
</h1>
<div class="buttons">
<div class="button_one">
<input type="button" value="buy" />
</div>
</div>
</div>
<div class="item">
<h1 class="item_title">
Title Peow, Wow.
</h1>
<div class="buttons">
<div class="button_one">
<input type="button" value="buy" />
</div>
</div>
</div>
</div>