We Keep Coding

How to select all elements that ends with certain id

Edit: let me reformulate this question
How to select all elements that ends with certain id
Ex:
<input id="person">
<span id="span_person"></span>
<input id="person_001">
My problem is, when I select with jQuery like
$("[id*=person]");
all inputs with similar id's are returning but in this case I just want to select the first two. I want to select all elements that the id ends with "person". Is there any way?
I use a framework that generates html code, so I can't change the id of the elements because it's based on the attribute name on the framework.

Use the $ operand for CSS selectors
[attribute$=value]
$("[id$='person']");
eg. Selects every element whose attribute value ends with value

An id is supposed to be unique. You should use a class to group elements you want to style with similar CSS, something like '.person'. Refer to: https://www.w3schools.com/html/html_id.asp

ID is only! You can't set ID for 2 tags!
I should change your span's id!

how to get part of textbox id in jquery

I have one textbox .the id is account_0__abc.the id will dynamically generted one.my question is how to select the id ending with __abc textboxes in a whole form using jquery?

Try to use attribute ends with selector,
$('[id$="__abc"]')

There are various selectors in jQuery to identify elements based on a part of their id or names. You can specify the element type as well.
Here's an example:
$('input[id$="__abc"]')
This will grab <input> elements with id ending with __abc. Be careful though, if you got multiple ones that match this criteria, you'll end up with a collection. You can iterate through the collection and do stuff to them with a .each() like so:
$('input[id$="__abc"]').each(function(){
// magic
});

If you want to make it more specific such as start with account_ and end with __abc then you can use:
$('[id^="account_"][id$="__abc"]')
https://api.jquery.com/attribute-starts-with-selector/
https://api.jquery.com/attribute-ends-with-selector/

Call element by id in javascript

I have a repeater and have a label with an icon inside it.
<strong><i id="iconProperties" class="icon-caret-right"></i> Properties</strong>
When i click a button the icon-caret-right must be turned to icon-caret-down. i have written the code as follows:
$('#iconProperties').removeClass('icon-caret-right').addClass('icon-caret-down');
When i use this code only the first row of the repeater is working. all other rows's icons are not changing. What is the mistake?

ASP.net generates unique ids for html elements and only one element can have id iconProperties that you used in selector. You can use Attribute Contains Selector [name*="value"] instead of id selector to get all the matching elements.
$('[id*=iconProperties]').removeClass('icon-caret-right').addClass('icon-caret-down');

If your ids have a similar name, you're probably after something like
$('[id^=iconProperties]').removeClass('icon-caret-right').addClass('icon-caret-down');
Which will update all items beginning with id "iconProperties".
It might be worth noting that it is common practice to use unique ids.

Try this:
$('#iconProperties').find('.icon-caret-right').replaceWith('.icon-caret-down');

Working with a narrowed down DOM using jQuery

I am currently trying to figure out a way to work within a selected <div> in order to be able to send a text formatted email.
So there is a button says "email". When a user clicks on it, it grabs a closest div as below.
var selectedDiv = $(callingElement).closest(".myClassName");
And from there I would like to grab various dom elements to create a clean text format. So how do I work within selectedDiv using jQuery?
For example,
Getting <h1> value.
Getting <li> value with certain class names
Getting "title" attribute value.

The selectedDiv jQuery object wraps the div element. Use the find method to search for descendant elements, and attr to get the attributes on the div element itself.
selectedDiv.find('h1');
selectedDiv.find('li.someClass');
selectedDiv.attr('title');
Call the text() method to get the text from the h1, or the li.
selectedDiv.find('h1').text();

selectedDiv.children('h1').text();
selectedDiv.children('li.className').text();
selectedDiv.attr('title');
But somehow I think you might be asking the "wrong" question.

Jquery doesn't apply hide() to all of the divs with the same ID

I'm making a site, and the html is displayed through php with data fetched from a database.
I have a foreach() function, so all of the things displayed have the same DIV ID's.
It ends up being like 4 DIVs with the same ID (#content), so the PHP works fine, but I have a jQuery script and when I call the jQuery("#content").hide(); it only hides ONE of the DIV's not all of them, and I want it to hide all of them. Is there something else I have to do?
Thanks.

You should use a class (.class_name), not an id--only one DOM element may have a given ID, otherwise it's invalid HTML. It's reasonable for an ID selector to return only a single element.

IDs on elements on a page should be unique. So every HTML tag you specify should have a different ID. If you want to hide all of a certain element, it might be suitable to add a class to the elements you wish to hide?
e.g.
<div class="divToHide">Content...</div>
<div class="divToHide">Content...</div>
<div class="divToHide">Content...</div>
Then your jquery would be:
$(".divToHide").hide();

That's simply because you cannot have more than one element with a specified ID. IDs are and must be unique. Only one single element with the same element may exist in a DOM.
Failing to follow this rule may result in broken scripts and other horrors.
You can use classes for this purpose.

an ID can only be used ONCE in HTML! because its a id and a id should always be Unique