Develop Reference

jQuery selector : 'starts-with && ends-with' doesnt work on element with multiple classes

The issue is simply as following, when I try to select a class that starts with a keyword , and ends with another keyword, this works fine, if and only if the element has a single class, if element has multiple classes, the selector will return an empty collection.
Here is code to explain the issue
// try removing custom-class from first element --> returns 2
alert($("div[class^='start'][class*='end']").length) // will return 1 by default , only 1 element has single class.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="custom-class start-mid-end" data-custom="1st Div">
</div>
<div class="start-mid-end" data-custom="2nd Div">
</div>

That's because for the element with class="custom-class start-mid-end", the value of its class attribute begins with custom, not start. Remember, the attribute selectors operate on the attribute value as a single string; they don't care that the class attribute is "special" in HTML.
Regarding a solution to your problem: there aren't any without caveats. As the most practical workaround, I would suggest using multiple classes instead of just one. For example, instead of just prefix-X-suffix also add the classes prefix- -suffix and then you can select your elements simply with
$("div[.prefix-.-suffix]")
Another option would be to use filter to customize the class selection logic, e.g.
$("div").filter(function() { return /\bstart\S*end\b/.test(this.className); })
The regex \bstart\S*end\b matches any sequence of non-whitespace characters with the prefix start and the suffix end, which is what you are after.

The selectors you use refer to the whole attribute string, so class="start what ever end" will be a match.

Jquery contains to remove certain character

<p>some string here xxx</p>
I want to remove the xxx characters
so I do $(p:contains('xxx')).remove(); but it removed the entire <p></p>, how to only get rid of the targeted character?

That would be the text method and a string replace
$('p').text(function(_, txt) {
return txt.replace('xxx', '');
});
remove removes entire elements, not parts of text.

That is the expected behavior of remove(), it removes whole elements . You can use text(fn) or html(fn) to do it.
$("p:contains('xxx')").text(function(idx, oldText){
return oldText.replace('xxx','');
});
If you also have other tags within the p use html(fn) as above

JQuery: Find all ids starting with any one of the specified Strings

I understand that I can use below selector to select a div starting with one string.
$('[id^="content_"]')
Find All Ids starting with a String
I have Divs that starts with Strings "content_" or "list_".
How do I select all divs on my document that starts with one of above 2 strings?
Something like below that should work,
$('[id^="content_"] OR [id^="content_"]')

You can use comma separated list of jquery selectors
$('[id^="content_"],[id^="list_"]')

Use comma to have multiple selectors. It will consider both
$('[id^=content_],[id^=list_]').each(function(){
alert($(this).text());
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="anchor">Shoaib</div>
<div id="content_anchor">Sajeed</div>
<div id="list_anchor">Chikate</div>

Select second to last element

i need to select the value of second to last input selectable element:
<tr><td><select class="x">...</select></td></tr>
<tr><td><select class="x">...</select></td></tr>
<tr><td><select class="x">...</select></td></tr>
The select input tag are inside tr tags.
If I use $("select.x").last(), jQuery select the last element. I need to select second to last.

You can use .eq() with negative indexes:
$("select.x").eq(-2);
These negative indexes are "1-indexed": -1 gives the last element, -2 the penultimate, and so on.

You can use .prev()
$("select.x").last().prev();

All of the below will do the trick (select the second last element):
$("select.x").eq(select.length - 1)
$("select.x:nth-last-of-type(2)")
$("select.x:nth-last-child(2)")
$("select.x").last().prev()

You can use :last selector and move to the preceding element using prev:
$("select.x:last").prev();
Ref:
Get the immediately preceding sibling of each element in the set of
matched elements, optionally filtered by a selector.
Sample demo: http://jsfiddle.net/IrvinDominin/ck8XP/

You need to use "nth-last-child(2)" of jquery, this selects the second last element.
You can check this here:
https://api.jquery.com/nth-last-child-selector/

The solutions with .prev() or nth-last-child() don't works.
<tr><td><a>...</a><select class="x"></select><a>...</a><td><tr>
<tr><td><a>...</a><select class="x"></select><a>...</a><td><tr>
<tr><td><a>...</a><select class="x"></select><a>...</a><td><tr>
<tr><td><a>...</a><select class="x"></select><a>...</a><td><tr>
The problem is the last().prev() functions return the the object <a> which i suppouse come first the select one.
The nth-last-of-type(2) selector instead return an empty object.

jQuery Select # id with word as prefix and counter as suffix

Is there a way to select all id's with jQuery with a prefix "my" and a suffix "0-9".
Something like these $("#my$1-4") or is it just possible with a loop ?
<div id="my1"/>
<div id="my2"/>
<div id="my3"/>
<div id="my4"/>
<div id="my5"/>

First thoughts, which seems to work well:
$('div[id^="my"]').filter(
function(){
return this.id.match(/\d+$/);
});
JS Fiddle demo.
The above selects all div elements whose id starts with the value my, and then filters the returned elements to those whose id also ends with numeric characters.
References:
attribute-starts-with selector.
filter().
Regular Expressions, at Mozilla Developer Network.

The prefix part is easily achievable with an attribute starts-with selector:
$("div[id^=my]");
But there is no selector that will allow you to specify a range of characters, so a loop will have to be involved. I would suggest filter:
$("div").filter(function () {
return /^my\d$/.test(this.id);
});

Assuming you don't have millions of elements that start with "my", you could do:
$('[id^=my]').filter(function() { return this.id.matches(/\d/) && this.id.length == 3 })
This grabs all elements that have an id starting with "my", contain a number, and are only 3 characters long (so "my54" will not match but "my6" will)