I have been experiencing an issue with the implementation of the "read more" feature on my website. Although the code seems to be functioning properly, it only works after pressing the read more button twice. This particular code is designed to detect the Wordpress read more tag in the text field at the backend and split the text into two parts.
https://i.stack.imgur.com/9Xdg0.png
For a visual representation of the problem, I have recorded a video here:
You can also observe the issue on one of the pages of my website, such as this one:
I believe that the code itself is working correctly, but there might be something causing the initial failure of the read more functionality. Any guidance or insight would be greatly appreciated. Thank you!
Here is the PHP code:
<?php
if(get_field('property_description')){
$highlights = get_field('property_description');
if(strpos($highlights, '<!--more-->') !== false) {
$start = strstr($highlights, '<!--more-->', true);
$end = strstr($highlights, '<!--more-->');
echo "<div class='exsec'>".$start."</div>";
echo "<div class='fullsec'>".$end."</div><div class='btnRM'><a href=''>READ MORE</a></div>";
} else {
echo $highlights;
}
}?>
And here is the JavaScript code:
jQuery('.btnRM a').click(function(e){
e.preventDefault();
if(jQuery(this).text()=="READ MORE"){
jQuery(this).parent().prev('.fullsec').fadeIn();
jQuery(this).text('LESS');
} else {
jQuery(this).parent().prev('.fullsec').fadeOut();
jQuery(this).text('READ MORE');
}
});