String manipulation using jQuery

Question

I am wondering how I would remove the vowels from a word on a button click?

Here is what I am trying to do - http://www.marcia.bnmla.com/~marcia/project0.html

I need to use jQuery to remove the vowels in the second box so it displays only consonants when you click the button. I have it where it displays "MRC" as text when the button is clicked and I need to redo it using string manipulation so I can change the word to anything in my code and it will remove the vowels in that word. I am obviously new at this. Please help me!

Here is my code:

<div id="marcia_box">
        <p id="marciatext">marcia</p>
        <div id="marcia_boxBtn"><button id="marciaBtn">Marcia</button></div>
</div>

$("#marciaBtn").click(function() {
    $("#marcia_box").css("background-color","#999");
    $("#marciatext").html('mrc');
});

Jarrett Meyer · Accepted Answer · 2012-10-30 18:12:17Z

4

Do you really need jQuery? What about plain old JavaScript?

"abcdef".replace(/[aeiou]/gi, "")  // => "bcdf"

How's that?

answered Oct 30, 2012 at 18:12

Jarrett Meyer

19.6k6 gold badges61 silver badges52 bronze badges

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

Comments

pimvdb · Accepted Answer · 2012-10-30 18:13:02Z

2

jQuery allows you to pass a function to .html, which should return a new HTML string. jQuery will pass the old HTML, so you can do something like this:

$("#marciatext").html(function(i, current) {
  return current.replace(/[aeiou]/g, "");
});

answered Oct 30, 2012 at 18:13

pimvdb

155k80 gold badges313 silver badges357 bronze badges

Comments

Roko C. Buljan · Accepted Answer · 2012-10-30 18:18:40Z

1

demo

This one will help you now and in the future for other transformations specially for
toggling between two array keys

var c=0, text=['marcia', 'mrc'];

$("#marciaBtn").click(function() {
    $("#marciatext").html( text[ ++c%2 ] );
});

answered Oct 30, 2012 at 18:18

Roko C. Buljan

209k41 gold badges335 silver badges346 bronze badges

Comments

Erick Petrucelli · Accepted Answer · 2012-10-30 18:14:45Z

0

As shown by Jarrett Meyer, removing the vowels has nothing with the jQuery part. But just to show you how to put it together with jQuery (since you said you is really new in it), here is a sample:

$("#marciatext").text($("#marciatext").text().replace(/[aeiou]/gi, ""));

answered Oct 30, 2012 at 18:14

Erick Petrucelli

15.1k9 gold badges68 silver badges89 bronze badges

Collectives™ on Stack Overflow

String manipulation using jQuery

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related