We Keep Coding

How to only select one multiple class with jQuery

I have a form that has checkmarks behind them. They all are tied to labels and have all the some class names. I could just make new classes or ID's for each one but figured their was an easier way to only select the checkmark that is inside that particular class?
http://jsfiddle.net/70fbLooL/
<script>
$(document).ready(function(){
$(".companyLabel").click(function(){
$(".fa-check").toggle();
$(this).toggleClass("companyLabelBackground");
});
});
</script>

$(".fa-check").toggle(); will toggle all elements with class .fa-check.
Instead, use find() to get the closest element in relation to this.
Try this:
$(document).ready(function () {
$(".companyLabel").click(function () {
$(this).find(".fa-check").toggle();
$(this).toggleClass("companyLabelBackground");
});
});
JSFiddle Demo

you can use .closest() and .find() to dynamically detect closest div or element. for example
$(this).closest('.companyLabel').find('.fa-check').toggle();
code :
$(document).ready(function(){
$(".companyLabel").click(function(){
$(this).closest('.companyLabel').find('.fa-check').toggle();
});
});
JSFIDDLE DEMO

Add the Class Dynamically using Jquery?

How can i add the class selectors dynamically to the img tag. For Example:
img tag should be inside the anchor tag then only the class name:sample should add dynamically whichever anchor tag contain img like,
Before:
<img src="image.png"/>
After:
<img src="image.png" class="sample"/>
If already image tag contain class then remove that class and the new class is possible in jquery. I am not sure, how can i do this in jQuery.
Any suggestion would be great.
Thanks,
vicky

You just need to toggle your class. To do this, see:
$("img").toggleClass("border");
I made an example for you on CodePen. Just click here.

$(document).ready(function(){
$('your selector').addClass('sample'); //It can be select,img,a,etc.. });
Be specific in your tag for choosing. I use in CakePHP 3.x Date HtmlHelper field and it worked like a magic.

if($('a[href=image.png] > img').hasClass('sample')){
$('a[href=image.png] > img').removeClass('sample');
}
And addClass for else part.

This can be done easily via jQuery.addClass and jQuery.removeClass APIs..
Add Class - http://api.jquery.com/addClass/
Remove Class - http://api.jquery.com/removeClass/

This should do it:
$('a img').removeClass().addClass('example')

$(document).ready(function(){
$('a >img').addClass('sample'); //direct descendant of a
});

HTML code:
<img id="testImg" src="xyz.jpg" />
css code:
.displayNone{
display:none;
}
jquery - to add class
`$("#testImg").addClass("displayNone");`
jquery - to remove class
$("#testImg").removeClass("displayNone");

Using Jquery, how do you change the css of the object you are clicking?

I am working on a very dynamic page which will have a lot of what we will call buttons for simplicity sake (actually are divs).
These buttons have a span tag inside which has display:none;. This all of these "buttons" have the Span inside with the css class which has them hidden. I can not create an #ID for each one, they are going to be dynamic
How can I, using Jquery, animate using .show() just the item being clicked. I can not input an ID, because it will be created dynamically with php.

$('.button').click(function(){
$(this).find('span').show();
})
jsfiddle

Try this
$("div").click(function(){
$(this).children("span").show();
});
DEMO
More information here

$(".className or #idName").css("thecssselector", "thevalue");
See Here

use this jQuery:
$(document).ready(function(){
$("tag name or id on which you will click").click(function(){
$("tagname on which you want to apply the css").css("property_name","property_value");
});
});

Here have some fiddle.
$('div').click(function(){
$(this).find('span').fadeIn("slow");
});

try this
$(".button").click(function(){
$("div span").hide();
$(this).find("span").show();
});

jQuery, Add elements to the set of matched element using string and variable

I have a click event and I want to add a class to the current element clicked plus an other element and I want to do that in one line.
I have tried something like
JS file
$('div').click(function(){
$(this, 'span').css('background','yellow');
// could usethe following way but it's not DRY
// $(this).css('background','yellow');
// $('span').css('background','yellow');
})​;
HTML file
<div>
div
</div>
<span>
span
</span>​
Here is a fiddle for exemple
But it doesn't works so how can I do without repeating the css method.

You can use .add(selector) method like so:
$(this).add('span').css('background','yellow');

You can add the <span> elements to the $(this) jQuery instance:
$(this).add( $('span') ).css('background', 'yellow');
or even:
$(this).add('span').css('background', 'yellow');
http://jsfiddle.net/Hhqc8/7/

Try siblings():
$('div').click(function(){
$(this).siblings('span').css('background','yellow');
})​
Example:
http://jsfiddle.net/Hhqc8/6/

Adding class to link in JQuery

I have a anchor tag and would like to add a class to it in my document ready function. How do I do that?
Thanks,
Sachin

$(function() {
/* domReady */
$('a').addClass('yourclass');
});
of course if your link has an id use a more specific selector like
$('#yourlink').addClass('yourclass');

$(document).ready(function() {
$('#id1_of_a, #id2_of_a, #id3_of_a').addClass('myClass');
});

$(function() {
$('a:first').addClass('yourclass'); // suppose add class to first <a>
});
or
$('a:eq(1)').addClass('yourclass'); // suppose add class to second <a> and so on
or
$('a#some').addClass('yourclass'); // suppose add class to <a> have id 'some'