Andrew Zheludkov
Andrew Zheludkov

Reputation: 75

Safari ignores my Jquery code for removing first word in span

I have a UL LI list

<ul class="tags no-animation clearfix" id="manufact">
    <li>
        <a href="">
            <img>
            <span>Logo name</span>
        </a>
    </li>
    <li>
        <a href="">
            <img>
            <span>Logo name</span>
        </a>
    </li>
</ul>

I need to get rid of the word "Logo" as is a duplicate. My JS is

$('#manufact li > a span').each(function(){
    var element = $(this);
    $(this).text(element[0].innerText.split(' ').splice(1).join(' '));
});

In all browsers except Safari this (maybe not perfect JS) is OK, in Safari it COMPLETELY wipes out everything in SPAN and leaves it blank.

I want to have this result -

<ul class="tags no-animation clearfix" id="manufact">
    <li>
        <a href="">
            <img>
            <span>name</span>
        </a>
    </li>
    <li>
        <a href="">
            <img>
            <span>name</span>
        </a>
    </li>
</ul>

Thanks ahead!

Upvotes: 0

Views: 39

Answers (2)

netomo
netomo

Reputation: 104

Try something like this:

$('#manufact li > a span').each(function(){
    var element = $(this);
    element.text(element.text().split(' ').splice(1).join(' '));
});

Upvotes: 1

Rory McCrossan
Rory McCrossan

Reputation: 337560

To achieve this more simply you can provide a function to text() which replaces only the word Logo at the start of the text value in each element. I haven't tested it, but this should work fine in Safari.

$('#manufact li > a span').text((i, t) => t.replace(/^Logo\s?/i, ''));
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul class="tags no-animation clearfix" id="manufact">
  <li>
    <a href="">
      <img>
      <span>Logo name</span>
    </a>
  </li>
  <li>
    <a href="">
      <img>
      <span>Logo name</span>
    </a>
  </li>
</ul>

If you always want to remove the first word in the span, no matter what that word is, then you can use your original logic with this pattern too:

$('#manufact li > a span').text((i, t) => t.split(' ').splice(1).join(' '));

Upvotes: 2

Related Questions