Develop Reference

Removing classes defined by a jQuery attribute selector from the results of a jQuery attribute selector

Basic problem, I just want to target all classes that end with a specified string on all elements of a class that ends with a specified string, and remove those classes.
This code doesn't work, but it's close to what I want:
$('[class$="_active"]').removeClass($('[class$="_active"]'))
$('[class$="_active"]') returns a jQuery.fn.init object which I can work through with .each(index,item). I thought it would then be as simple as item.removeClass($('[class$="_active"]')) but the code below does not work either:
$('[class$="_active"]').each(function(index,item){
item.removeClass($('[class$="_active"]'))
})
The removeClass function does not work on the items in my each function. At this point I'm considering stringifying each item, figuring out the text immediately before "_active", removing it from the string along with "_active", then returning the reformed result. But this is just getting too complicated for a basic problem that I assume has a basic answer that I overlooked.

You can use attribute containing selector and attribute ends with selector to get all element with a certain class which ends with _active. To remove the class first you have to extract the certain class from the class list using String#match method(it's only necessary if there are multiple classes for an element).
$('[class$="_active"],[class*="_active "]').each(function(){
$(this).removeClass($(this).attr('class').match(/\S+_active\b/)[0])
// or $(this).removeClass(this.className.match(/\S+_active\b/)[0])
})

Just one lovely Solution
$('[class$="_active"]').each(function(i){$(this).removeClass(this.className)})
this is my jsfiddle link, have a look
https://jsfiddle.net/dupinderdhiman/mgzf2boL/7/

add attribute to DOM element

I have a modal form that is generated using bootstrap 3. It doesn't look like there is a reliable way to determine when that form is being shown onscreen. I am attempting to create one. I attached two events to my DOM element that signal when it is shown and when it is hidden.
jq_modal_login_form = $('#modal-login-form')[0]
jq_modal_login_form.on('shown.bs.modal', function () {
jq_modal_login_form.active_onscreen = true;
});
jq_modal_login_form.on('hidden.bs.modal', function () {
jq_modal_login_form.active_onscreen = false;
});
I tried to give an attribute named active_onscreen to the DOM element above. When I look at the DOM element in the debugger later, the attribute is not present.
I should mention that I am VERY new to javascript. Is attribute even the right word to use here? It looks like attribute is a bit of a misnomer as well. It could be an attribute of the object but could also be an attribute of the object.attributes attribute, right? I assume the later is where styling ect., goes and is not what I want to change. Does anyone have some insight as to what I should be doing here?

In jQuery:
$('selector').attr('attribute_name', 'value');
However, you can should only use predefined attributes as creating custom attributes requires additional setup (see this question) that is not necessary in your case.
In your case, you may just want to add a active_onscreen class to the element. Classes are meant to be used to identify elements (and not just for CSS), so they are perfect for this applicaiton. You would use this to add a class to an element:
$('selector').addClass('active_onscreen').
When it is no longer active, you would use this to remove the class:
$('selector').removeClass('active_onscreen').

What you are doing here is adding a property of the DOM object - not an attribute of the element.
Adding an attribute does not necessarily make the property mirror it. Only built-in properties do this.
If you want to set an attribute, but not the property, you can use jQuery's .attr() method.

If you just want to see if a given modal is open, Bootstrap does that for you. You can check the bs.modal data attribute:
$("element").data('bs.modal').isShown;
or a class (but this method is prone to race conditions):
$('#myModal').hasClass('in');

How to remove all instances of a class in javascript/jquery?

I have this class called .m-active that is used multiple times throughout my HTML.
Basically what I want to do is remove all instances of that class when a user clicks on an image (which does not have the m-active class) and add the m-active class to that image.
For instance in a Backgrid row you might have a click handler as follows:
"click": function () {
this.$el.addClass('m-active');
}
But you also want to remove that class from any rows to which it was previously added, so that only one row at a time has the .m-active class
Does anyone know how this can be done in javascript/jquery?

With jQuery:
$('.m-active').removeClass('m-active');
Explanation:
Calling $('.m-active') selects all elements from the document that contain class m-active
Whatever you chain after this selector gets applied to all selected elements
Chaining the call with removeClass('m-active') removes class m-active from all of the selected elements
For documentation on this specific method, see: http://api.jquery.com/removeClass/
Getting grasp of the whole selector thing with jQuery is challenging at first, but once you get it, you see everything in very different light. I encourage you to take a look into some good jQuery tutorials. I personally recommend checking out Codeacademy's jQuery track: http://www.codecademy.com/tracks/jquery

all answers point to remove the class from the DOM element. But if you are asking to remove the element itself you can user .remove() jquery method
$('.m-active').remove();
JQuery Remove Docs

In plain JavaScript (no jquery):
for (elem of document.getElementsByClassName("m-active")) {
elem.classList.remove("m-active");
}

Jquery-:
$("class").removeClass("your class");
javascript-:
Set the class name to nothing when you want to remove class in javascript!!!
document.getElementById("your id").className = "";
or
element.classList.remove("class name");

Specifically addressing the code block added to strengthen the quality of the question, and borrowing from jsalonen:
"click": function () {
$('.m-active').removeClass('m-active');
this.$el.addClass('m-active');
}

When you use jQuery .removeClass() does it return an error when run on an element that does not have that class?

I have four html elements that when clicked I want to have a specific class applied to. The problem is that that class is only for one of the four at any one time. I want to when one element is clicked have that class removed from the other three elements and applied to the one that was clicked. If I were to run a loop that removed that class from every single element before applying that class to the element clicked would there be an error on the elements that did not have that class?

#chrome dude, no there won't be any problem. Jquery takes care of null check. If you have class it will do it otherwise it won't do it.

No. The removeClass() function returns jQuery (the same jQuery object it was invoked on) and won't do anything if the class isn't present. You really only need to remove the class from the element that has it, though.
$('a').click( function() {
$('a.foo-class').removeClass('foo-class');
$(this).addClass('foo-class');
});

No.

Dynamic check whether class is present or not

i have the following classes applied to a span tag :
c1
i want to check whether c_2 (any particular class) is applied or not using js

Use jQuery JavaScript library and things like these are all already implemented in there. You could use the .hasClass() method to check whether an element has a css class