Find id by pattern (Without jquery or 3rd party libraries)

Question

I have a button:

<button id="btn:1:uniquenamehere">btn</button>

the number in the middle sometimes changes due to other frameworks internal workings. I need to be able to find this button no matter the number in the middle. So I need to find it by pattern where only the middle number will change. So I need something like this:

document.getElementById("btn:*:uniquenamehere")

I saw ways of doing it using jquery, but I can't use 3rd party libraries. How can I do this with pure javascript?

Can you not just add a class to those buttons and then look them up by their class name ? — htatche, Jul 08 '15 at 18:48
Take a look [at this question](http://stackoverflow.com/q/12566888/1685196) or [this one](http://stackoverflow.com/q/6991494/1685196) — Michel, Jul 08 '15 at 18:52

score 2 · Accepted Answer · answered Jul 08 '15 at 18:49

2

You can use document.querySelectorAll():

var elems = document.querySelectorAll('[id$="uniquenamehere"]');

JSFiddle

answered Jul 08 '15 at 18:49

George

36,413
9
66
103

Thank you! EXACTLY what I was looking for! – user2924127 Jul 08 '15 at 19:22

b00t · Answer 2 · 2015-07-08T19:35:12.483

0

Also, if you'd like to fool around a bit, this is a good (if not as efficient) way:

function getButton (buttonid) {
    var buttons = document.getElementsByTagName('button');
    for (var i = 0; i < buttons.length; i += 1) {
        if (buttons[i].id.slice(buttons[i].id.length - buttonid.length) === buttonid) {
            return buttons[i];
        }
    }
    return null;
}

JSFiddle

edited Jul 08 '15 at 19:35

answered Jul 08 '15 at 19:29

b00t

409
3
10

Find id by pattern (Without jquery or 3rd party libraries)

2 Answers2