Это то, что вы хотите?
$(document).ready(function() {
$(".content-new").hide();
$(".show_hide_new").on("click", function() {
var txt = $(this).prev(".content-new").is(':visible') ? 'Read More' : 'Read Less';
$(this).text(txt);
$(this).prev('.content-new').slideToggle(100);
});
});
Я изменил 2 вещи, сначала я изменил $(".content-new").is(':visible')
на $(this).prev(".content-new").is(':visible')
секунду, я изменил $(".show_hide_new").text(txt);
на $(this).text(txt);
демо
$(document).ready(function() {
$(".content-new").hide();
$(".show_hide_new").on("click", function() {
var txt = $(this).prev(".content-new").is(':visible') ? 'Read More' : 'Read Less';
$(this).text(txt);
$(this).prev('.content-new').slideToggle(100);
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="box">
<li>GST Registration</li>
<li>Final Proprietorship Registration in 10 Working Days</li>
<div class="content-new">
<!-- This is hide by default and open on toggle -->
<li>Current Bank Account Opening KIT </li>
<li>MSME Certificate</li>
<li>CA Certificate </li>
<li>TAN Acknowledgement)</li>
</div>
<div class="show_hide_new">
Read More
</div>
</div>
<!-- box closed -->
Below I repeat above code just explain that multiple divs should show read more and real less individually.
<div class="box">
<li>GST Registration</li>
<li>Final Proprietorship Registration in 10 Working Days</li>
<div class="content-new">
<!-- This is hide by default and open on toggle -->
<li>Current Bank Account Opening KIT </li>
<li>MSME Certificate</li>
<li>CA Certificate </li>
<li>TAN Acknowledgement)</li>
</div>
<div class="show_hide_new">
Read More
</div>
</div>
<!-- box closed -->