I'm still trying to learn the basics of JS.
Basically i just want to remove the first word from a given class. Like this:
Before:
<span class="remove-word">on the beach</span>
After:
<span class="remove-word">the beach</span>
I managed to do it by creating this piece of code:
jQuery(document).ready(
function(){
jQuery('.remove-word').text(jQuery('.remove-word').text().replace('on',''));
jQuery('.remove-word').text(jQuery('.remove-word').text().replace('at',''));
});
Problem now is that this works fine if i only have one instance of the ".remove-word" class present on a page, but as i have many i need to wrap the code in a .each() function otherwise this happens:
jQuery(document).ready(
function(){
jQuery('.remove-word').text(jQuery('.remove-word').text().replace('on',''));
jQuery('.remove-word').text(jQuery('.remove-word').text().replace('at',''));
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div><span class="remove-word">on the beach</span></div>
<div><span class="remove-word">at the roof</span></div>
<div><span class="remove-word">on the hill</span></div>How do i implement the .each() function here?
Alternatively i think a script which just removes the first word without looking for either "on" or "at" would be ideal, but i tried and it's out of reach for me with my limited js knowledge as things stand, which is why i did it using the .replace() way instead.
Thanks.
what about this?
jQuery('.remove-word').each(function( index ) {
//get the index of the first space to the end of the string
var firstWord = $(this).text().substring($(this).text().indexOf(' '), $(this).text().length);
//set the value
$(this).text(firstWord );
});
You will want to do some error handling for .remove-word where there is no text at all or no spaces but this should be a good starting point
You can do this. You can add .each to .remove-word class and then replace their content.
$(document).ready(function() {
$(".remove-word").each((idx,htmlSpan)=>{
$(htmlSpan).text($(htmlSpan).text().replace('at',''));
})
});
If you just want to remove only the 1st word, then you can do this.
$(document).ready(function() {
$(".remove-word").each((idx,htmlSpan)=>{
let text = $(htmlSpan).text(); // get text
let splittedText = text.split(" "); // split sentence on space. returns array.
let remainingWords = splittedText.splice(1); // get array from index 1 to last so index 0 is removed.
$(htmlSpan).text(remainingWords.join(" ")) // .join is joining string with " " space
})
});