We Keep Coding

Active class not working properly

I have some menu items and in the menu I have a plus(+) sign. When I click on the plus sign it should add a class and look like cross. It is happening but when I click the cross sign it does not removing the sign so that I can get the plus sign again.
$(document).ready(function(){
$('.nav-link').click(function(){
$('.nav-link').removeClass('addplus');
$(this).addClass('addplus');
});
});
Here is the Example.

The issue is because you are always removing, then immediately adding the class back on the clicked element. To fix this exclude the current element from the removeClass() call using not(), then use toggleClass() to add/remove the class to the required element, like this:
$('.nav-link').click(function() {
$('.nav-link').not(this).removeClass('addplus');
$(this).toggleClass('addplus');
});
Updated fiddle

I've gone a bit around about the houses here, but this works using parent and siblings:
$('.nav-link').click(function() {
$(this).parent(".nav-item").siblings().children(".nav-link").removeClass('addplus');
$(this).toggleClass('addplus');
});
I wouldn't do a blanket removeClass across all matching elements like you've done, I'd pick them out by excluding the currently matched element. Revised fiddle: https://jsfiddle.net/epqxb6L7/5/

It's because your code is removing and adding the same class every time click event triggers. Try something like this
$(document).ready(function(){
$('.nav-link').click(function(){
$(this).toggleClass('addplus'); //THIS WILL ADD/REMOVE CLASS ALTERNATIVELY
});
});

You always add the class addplus in the last line of your click handler. Try the following instead:
$(document).ready(function(){
$('.nav-link').click(function(){
if ($(this).hasClass('addplus')) {
$(this).removeClass('addplus');
} else {
$(this).addClass('addplus');
}
});
});

Body hasclass doesn´t work

so my code which should add a class to an element if the body has a certain class doesnt work. It looks like this:
if ($("body").hasClass("shifter-open")) {
$(".scrollheader").addClass("hovered");
}
I think its because a Jquery code adds this class (shifter-open) to the body with this code:
$( document ).ready(function() {
$("body").addClass("shifter shifter-active");
$('.shifter-handle').click( function() {
$("body").toggleClass("shifter-open", 1000);
});
});
Is there a way to make my code work? and maybe combine these 2 codes into one?

Your conditional :
if ($("body").hasClass("shifter-open")) {
$(".scrollheader").addClass("hovered");
}
Is only going to be evaluated once unless you have a timeout or interval polling it. A better solution might be to combine those two sections into one. Such as:
$( document ).ready(function() {
$("body").addClass("shifter shifter-active");
$('.shifter-handle').click( function() {
$("body").toggleClass("shifter-open", 1000);
$(".scrollheader").toggleClass("hovered");
});
});
Or something like that. You might also want to check the documentation for toggleClass because it doesn't appear to take an integer as a second parameter

Assuming you want to remove the class as well, just imitate exactly what the body is doing. You can toggle the class hovered on your .scrollheader just as the body is toggling its shift-open class.
$( document ).ready(function() {
$("body").addClass("shifter shifter-active");
$('.shifter-handle').click( function() { //When shifter-handle is clicked
$("body").toggleClass("shifter-open"); //Toggle "shifter-open" on the body
$(".scrollheader").toggleClass("hovered"); //Toggle "hovered" on .scrollheader
});
});
Additionally, the second parameter of toggleClass() takes a boolean that determines if the toggle should activate. Your second parameter of 1000 is permanently truthy, so there is no reason at all to include it.

Add class 'active' in AJAX Pagination

I have a pagination, and my pagination is not using any plugin, I just create it by myself. But, I have a problem, how can I give a class='active' when the button is clicked. I just using function in my pagination. Please help, thank you.

$(document).on('click','your-element-class', function() {
if ($(this).hasClass('active')) {
$(this).removeClass('active');
} else {
$(this).addClass('active');
}
});
When the element is clicked, if it already has the active class, it will be removed; otherwise it will be added.

adding and remove classes on click events

I am working on a click event, which intially is pretty standard.
on.click: Remove the active class from all list items, then add active to the clicked list item.
ie
var li = $('.child-item');
li.click(function(){
li.removeClass('active');
li.addClass('active');
});
Works as expected. However, I also need a condition that if the active class is clicked again, it will remove the active class from the clicked item.
I tried this:
$('.child-item').toggle(function(e){
$('.child-item').removeClass('active');
$(this).addClass('active');
}, function() {
$('.child-item').removeClass('active');
$(this).removeClass('active');
});
but often the toggle is in the off state, so it requires a double click to get the toggle back on track. This seems like it would be a pretty straightforward solution, but I cannot seem to get it to work.
Added a jsFiddle here with another option. This is fine for when the same element is clicked, but it doesn't clear all active classes on each click.
Update
I got it working but TrueBlueAussie's answer is shorter and better. Here is my working fiddle:
https://jsfiddle.net/v7b8cbj5/

Your second click handler will only attach to matching "active" items when the event was registered.
Replace it all with just this:
$('.child-item').click(function(e){
$('.child-item.active').not(this).removeClass('active');
$(this).toggleClass('active');
});
You can use not() to exclude the current item from selected list of things to make inactive, then just toggle the selected one.
JSFiddle: https://jsfiddle.net/81ex7dmm/2/

.toggle() (Event) - is deprecated in jQuery 1.8 and removed in jQuery 1.9
Use add() with toggleClass() on .active <li>
$('.child-item').click(function(e){
$('li.child-item.active').add(this).toggleClass('active');
});
Updated Fiddle

var li = $('.child-item');
li.click(function(){
li.removeClass('active');
$(this).toggleClass('active');
});

Try it also :
$('.child-item').click(function(e){
$('.child-item.active').removeClass('active');
$(this).addClass('active');
});
FIDDLE DEMO

Show/hide jQuery function not working

I'm trying to code a simple show/hide div using jQuery. Basically, when I click on .artist-ken, I want the artists-home div to disappear and .ken-gallery to replace it.
So far, I have this, but it's not doing anything except jumping to the top of the page:
$('.artist-ken').click(function(){
$('.artists-home').hide().show('ken-gallery');
});

Try this:
$('.artist-ken').click(function(e){
e.preventDefault();
$('.artists-home').hide();
$('.ken-gallery').show();
});
Function preventDefault() will stop from jumping in the page. You need separate show for displaying another div. Also . was missing in the ken-gallery.

jQuery.show() doesn't take a selector as a first parameter, try this instead:
$('.artist-ken').click(function(){
$('.artists-home').hide();
$('.ken-gallery').show();
});
I'm assuming that the element that you want to hide has the class ".ken-gallery" and that the element that you want to show has the class: ".artists-home"

$('.artist-ken').click(function(e){
e.preventDefault();
$(".artists-home").hide( 0, function() {
$('.ken-gallery').show();
});
});

Try this
$('.artist-ken').click(function(e){
e.preventDefault();
$('.artists-home').hide();
$('.ken-gallery').show();
});
What you did was not a real parameter for the show() function. Plus even if it were you didn't specify that it was a class. It can only take a function, duration, nothing, or object refer to the jQuery show reference page You can also create a one way listener to show or hide the other.
$(document).click(function(e){
if( e.target.classList.contains('artists-home') ) {
e.preventDefault();
$(e.target).hide();
$('.ken-gallery').show();
}else if( e.target.classList.contains('ken-gallery') ){
e.preventDefault();
$(e.target).hide();
$('.artists-home').show();
}
});
Also what Chonger was saying, is if you wanted a fade which is the duration parameter for any of the show/hide and other animated properties of jQuery, then we would use a callback. So my single function listener would then become.
$(document).click(function(e){
if( e.target.classList.contains('artists-home') ) {
$(e.target).hide(500,function(){
$('.ken-gallery').show();
});
}else if( e.target.classList.contains('ken-gallery') ){
$(e.target).hide(500,function(){
$('.artists-home').show();
});
}
});
EDIT
Reread your question, these must be links for the page to jump to top so I added to the functions.

Dude show() cant have parameter in () Brackets except Speed Or way of animation like show('slow') OR show('1000') is only valid .
Your syntax is wrong
The following is valid syntax.
It means , hide div with class ".artists-home" and show with class ".ken-gallery".
$('.artist-ken').click(function(){
$('.artists-home').hide();
$('.ken-gallery').show();
});
For more info show