Regular expression jQuery not working

Question

I'm having some problems using reg expression to remove unwanted spaces in my title. This is my code:

<ul>
 <li>
    <a href="#make/281">
      <img src="/images/cook-hat.svg">
      <span class="label label-primary">label</span>
      <div class="title-box"><span class="title">      my title     </span></div>
      <span class="goal-list">4</span>
    </a>
 </li>


$("li").val(
  $("span.title").text().replace(/\n/g, "")
  .replace(/\s/g,'')
);

Any help would be appreciated

Only test of the <span class="title"> should be replaced or entire li element ? — Rayon
– Rayon, Commented Mar 11, 2016 at 6:44
I believe li has no valu why use .val() ? use .text() or .html() according to need — guradio
– guradio, Commented Mar 11, 2016 at 6:59

Rayon · Accepted Answer · 2016-03-11 07:47:59Z

1

Use .text() instead of .val()

Try this:

$("li").text(
  $("span.title").text().replace(/\n/g, "")
  .replace(/\s/g, ' ')
);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<ul>
  <li>
    <a href="#make/281">
      <img src="/images/cook-hat.svg">
      <span class="label label-primary">label</span>
      <div class="title-box"><span class="title">      my title     </span>
      </div>
      <span class="goal-list">4</span>
    </a>
  </li>
</ul>

Edit: To set text of multiple li elements.

$("li").text(
  function() {
    return $(this).find("span.title").text().replace(/\n/g, "")
      .replace(/\s/g, ' ')
  }
);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<ul>
  <li>
    <a href="#make/281">
      <img src="/images/cook-hat.svg">
      <span class="label label-primary">label</span>
      <div class="title-box"><span class="title">      my title     </span>
      </div>
      <span class="goal-list">4</span>
    </a>
  </li>
  <li>
    <a href="#make/281">
      <img src="/images/cook-hat.svg">
      <span class="label label-primary">label</span>
      <div class="title-box"><span class="title">      my title     </span>
      </div>
      <span class="goal-list">4</span>
    </a>
  </li>
</ul>

edited Mar 11, 2016 at 7:47

answered Mar 11, 2016 at 6:42

Rayon

36.6k5 gold badges54 silver badges78 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Joseph Zammit Over a year ago

This works good what if I want to go through a list of multiple li? should I use a loop for that?

Joseph Zammit Over a year ago

Is this correct? $("li").each(function(){ $("span.title").text().replace(/\n/g, "") .replace(/\s/g, ' ') });

gurvinder372 · Accepted Answer · 2016-03-11 06:51:22Z

1

.replace(/\s/g,'')

will replace all spaces in the text. Not sure you want that since you said remove unwanted spaces.

If you want to trim the string from following and trailing spaces, then simply do

$("li").html(  $("span.title").text().trim() );

edited Mar 11, 2016 at 6:51

answered Mar 11, 2016 at 6:44

gurvinder372

68.6k11 gold badges78 silver badges98 bronze badges

2 Comments

Rayon Over a year ago

/g match all occurrences

gurvinder372 Over a year ago

@RayonDabre you are right, it won't. Updated the code

Collectives™ on Stack Overflow

Regular expression jQuery not working

2 Answers 2

2 Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related