How to select some kind of elements?

Question

I have two kind of <textarea>:

1) Posts: id="textarea-post-{id}"

2) Comments: id="textarea-cmnt-{id}"

For example, here is all textarea in the page:

<textarea id="textarea-post-1"></textarea>
<textarea id="textarea-cmnt-1"></textarea>
<textarea id="textarea-cmnt-2"></textarea>
<textarea id="textarea-cmnt-3"></textarea>
<textarea id="textarea-post-2"></textarea>
<textarea id="textarea-cmnt-4"></textarea>
<textarea id="textarea-cmnt-5"></textarea>
<textarea id="textarea-post-3"></textarea>
<textarea id="textarea-cmnt-6"></textarea>

Ok well, Now I want to know, how can I select all the post kind textarea ? These:

<textarea id="textarea-post-1"></textarea>
<textarea id="textarea-post-2"></textarea>
<textarea id="textarea-post-3"></textarea>

Answer 1

You can use a css selector with querySelectorAll like this :

document.querySelectorAll('[id^="textarea-post"]');

The ^= operator will look for every element with an id starting with textarea-post.

jQuery version :

$('[id^="textarea-post"]');

Answer 2

console.log($('textarea[id*=post]'));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<textarea id="textarea-post-1"></textarea>
<textarea id="textarea-cmnt-1"></textarea>
<textarea id="textarea-cmnt-2"></textarea>
<textarea id="textarea-cmnt-3"></textarea>
<textarea id="textarea-post-2"></textarea>
<textarea id="textarea-cmnt-4"></textarea>
<textarea id="textarea-cmnt-5"></textarea>
<textarea id="textarea-post-3"></textarea>
<textarea id="textarea-cmnt-6"></textarea>