How to get all elements inside "div" that starts with a known text

Question

Hello,

I have a div element in HTML document.

I would like to extract all elements inside this div which id starts with a known text (e.g. "q17_").

How can I achieve this using JavaScript ?

(If needed, for simplicity, I can assume that all elements inside the div are of type input or select.)

Thanks !

Answer 1

var matches = [];
var searchEles = document.getElementById("myDiv").children;
for(var i = 0; i < searchEles.length; i++) {
    if(searchEles[i].tagName == 'SELECT' || searchEles.tagName == 'INPUT') {
        if(searchEles[i].id.indexOf('q1_') == 0) {
            matches.push(searchEles[i]);
        }
    }
}

Once again, I strongly suggest jQuery for such tasks:

$("#myDiv :input").hide(); // :input matches all input elements, including selects

Answer 2

// Option 1: Likely fastest but not supported by early Firefoxes
var elements = document.getElementById('parentContainer').children;

// Option 2: Likely slowest
var elements = document.getElementById('parentContainer').getElementsByTagName('*');

// Option 3: Requires change to code (wrap a form instead of a div around it)
// Since what you're doing looks like it should be in a form...
var elements = document.forms['parentContainer'].elements;

var matches = [];

for (var i = 0; i < elements.length; i++)
    if (elements[i].value.indexOf('q17_') == 0)
        matches.push(elements[i]);