How to get the index of an option in a select menu by matching the text with plain Javascript?

jsfiddle.net/x8f7g/1 You want to select the element, iterate over the array, find the text value, and return the index Don't use InnerHTML, it's slow and breaks and not standards compliant Don't use innerText, simmilar reasons but not quite as serious Do use a function so you can do it all over again Do select the child text node, and retreives the nodeValue, which is cross-browser friendly Example: function indexMatchingText(ele, text) { for (var i=0; iNodeValue === text){ return i; } } return undefined; }.

jsfiddle.net/x8f7g/1/ You want to select the element, iterate over the array, find the text value, and return the index. Don't use InnerHTML, it's slow and breaks and not standards compliant Don't use innerText, simmilar reasons but not quite as serious Do use a function so you can do it all over again. Do select the child text node, and retreives the nodeValue, which is cross-browser friendly Example: function indexMatchingText(ele, text) { for (var i=0; iLength;i++) { if (elei.

ChildNodes0. NodeValue === text){ return i; } } return undefined; }.

Var opts = document. GetElementById("names"). Options; for(var I = 0; I Length; i++) { if(optsi.

InnerText == "Max") { alert("found it at index " + I + " or number " + (i + 1)); break; } } Demo.

Thanks for the response, but it has to be plain JavaScript -- no jQuery! – Zoolander Sep 20 at 18:36 Edited, sorry 'bout that. – karim79 Sep 20 at 18:41 developer.mozilla.Org/en/Using_Web_Standards_in_your_Web_Pages/… – Incognito Sep 20 at 19:04.

Try this, it should find and then select the relevant option in the select box. Var searchtext = "max"; for (var I = 0; I Text === searchtext) listbox.optionsi. Selected = true; }.

In PLAIN js var sel, opts, opt, x, txt; txt='Max'; sel=document. GetElementById('names'); opts=sel. Options; for (x=0;xLenght;x++){ if (optsx.

Text === txt){ opt=optsx; } }.

This should do the trick: var options = document. GetElementsByTagName('select')0. Children, i, l = options.

Length, index; for(i = 0; I.

The options property stores the options in a select menu - iterate over it and compare the contents. Var list = document. GetElementById("names").

Options; for(var I = 0; iSelected = true; //Select the option. } } JSFiddle: jsfiddle.net/cuTxu/2.

Don't use innerHTML it assassinates performance. – Incognito Sep 20 at 18:46 @Incognito Updated my answer. Is it really so bad that "assassinates" is a valid description?

– Dennis Sep 20 at 18:53 Absolutely, it's a non-standard thing that treats the DOM as if the object-model is raw-text to be altered all willy-nilly, it's not part of the spec either. Go see how bad it is performance wise for yourself on jsperf. – Incognito Sep 20 at 18:55 @Incognito Good to know.

I hadn't realized that it was not part of the standard. – Dennis Sep 20 at 19:38 It's because of how the DOM works, MISE introduced innerHTML wayyyy back, anyone who uses it surrenders their right to badmouth IE6 :P. It's because once HTML is read by your browser as objects in memory, not a string that's parsed as html each time a change is made to the document.

Browsers force it to work because of "backwards compatibility," and it leads to more problems and a slower experience for everyone. – Incognito Sep 20 at 19:46.

Var x = document. GetElementById("names"); for(var I = 0; iText){ doSomething(); //maybe x. SelectedIndex = i; } }.

1 This selects by the value, not the text node's value. – Incognito Sep 20 at 18:56.

Edit - expanded to include non-jquery method I strongly recommend using jQuery for this since the solution is a one-liner: jQuery('#names option:contains("Max")').val() However, here's a pure JavaScript implementation anyway: function findOption( select, matchMe ) { var // list of child options options = select. GetElementsByTagName('option'), // iteration vars I = options. Length, text, option; while (i--) { option = optionsi; text = option.

TextContent || option. InnerText || ''; // (optional) add additional processing to text, such as trimming whitespace text = text. Replace(/^\s+|\s+$/g); if (text === matchMe) { return option.

GetAttribute('value'); } } return null; } Example usage: alert( findOption( document. GetElementsByTagName('select')0, "Max" ) ); Alerts 3.

Thanks for the response, but it has to be plain JavaScript -- no jQuery! – Zoolander Sep 20 at 18:36 Ah, sorry, thanks for clarifying! – jimbojw Sep 20 at 18:37 I strongly recommend learning how to use plain JavaScript and becoming aware of what would make jQuery undesirable for something like this.

– Incognito Sep 20 at 19:28.

I cant really gove you an answer,but what I can give you is a way to a solution, that is you have to find the anglde that you relate to or peaks your interest. A good paper is one that people get drawn into because it reaches them ln some way.As for me WW11 to me, I think of the holocaust and the effect it had on the survivors, their families and those who stood by and did nothing until it was too late.