CODEWITHSUNDEEP
javascriptjquerystring
pixelpusher13
pixelpusher13

Reputation: 23

String manipulation using jQuery

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');
});

Upvotes: 2

Views: 501

Answers (4)

Roko C. Buljan
Roko C. Buljan

Reputation: 206028

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 ] );
});

Upvotes: 1

Erick Petrucelli
Erick Petrucelli

Reputation: 14872

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, ""));

Upvotes: 0

pimvdb
pimvdb

Reputation: 154818

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, "");
});

Upvotes: 2

Jarrett Meyer
Jarrett Meyer

Reputation: 19573

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

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

How's that?

Upvotes: 4

Related Questions