i want to add a class name 'disabled' under a parent div call 'anchorxx'
The disabled class div can be anywhere in the anchorXX divs
is it possible to do it with jquery ? i have no idea how i can manage to do it.
Thanks for your helps
a simple approach is
$(".anchor"+ id + " > div").addClass("disabled")
class will be added to the immediate div child element of .anchor1 div
Use jquery prefix selector and find the relevant element. Use addClass to add the required class
$('div[id^=anchor]').find('.whereYouwantToadd').addClass('someClass')
you can use jQuery's wildcard selector for this purpose.
link
you can find the anchor id and change the class of underlying div like this:
$('div[id*="anchor"]').child('div.fiche-left-disabled').addClass('disabled');
Add the 'disabled' class to its first children:
$('#anchor1').children().first().addClass('disabled')
For all anchors
$('div[id^="anchor"]').children().first().addClass('disabled')
Related
I'm using jQuery to remove CSS class from my elements:
$('.input-group-addon').child($('.glyphicon.glyphicon-calendar').removeClass());
Now on same action immediately I remove that class I want to add myClass for example so I tried:
$('.input-group-addon').child().addClass('myClass');
But this doesn't work, my element stays with class="" instead of class="myClass".
You don't need to use children() at all:
$('.input-group-addon > .glyphicon.glyphicon-calendar').removeClass();
Add class back to all direct ancestors:
$('.input-group-addon > *').addClass('myClass');
.child() is not a jQuery function replace it by .children() :
$('.input-group-addon').children().removeClass();
$('.input-group-addon').children().addClass('myClass');
Or without children() method :
$('.input-group-addon .glyphicon.glyphicon-calendar').removeClass();
$('.input-group-addon .glyphicon.glyphicon-calendar').addClass('myClass');
Hope this helps.
You need to specify the class you want to remove..
$('.input-group-addon').child($('.glyphicon.glyphicon-calendar').removeClass("className"));
Currently, this
$('.input-group-addon').child($('.glyphicon.glyphicon-calendar').removeClass());
removes everything.
I have the following JQuery:
$('.one').addClass('two');
I need to add the class two only if the element of class one is a list item li. How do I do this?
You can try this:
$('li.one').addClass('two');
Use jQuery is()
if($('.one').is('li')){
$('.one').addClass('two');
}
or alternatively, in one line
$('li.one').addClass('two');
This will select only li elements of class one and nothing else
You could also try:
$("li.one").addClass("two");
All li elements that have a class one will have the class two added.
I have a situation with two divs, one parent div which has proper classes and another div inside the parent div which doesn't have any class but on a jquery event from the parent div I want to assign a class to the inner div.
This is how the structure looks:
<div class="noUi-handle noUi-handle-lower">
<div class="">
<span></span>
</div>
</div>
Any advice how to get to the inner div and assign a class by calling the parent div with jquery?
Yes, you can use attr-elem selector like
$('.noUi-handle.noUi-handle-lower > div[class=""]').addClass('whatever');
Demo
If you don't want to add class with jQuery and simply want to target those elements than only CSS would suffice as well..
.noUi-handle.noUi-handle-lower > div[class=""] {
/* Targets those div elements which has empty class attribute */
}
Explanation : The selector selects all the div elements with empty class attribute which are direct child to element having both the classes i.e .noUi-handle and .noUi-handle-lower
Try .find. In conjunction with $(this) it will only look for child elements on that event.
function pizzaToppings() {
$(this).find('div').addClass('mushrooms');
}
$('.noUi-handle').on('click', pizzaToppings);
FIDDLE
I have this code.
<div class="1st-class"></div>
and I have a button, when I click it, the div will be like this.
<div class="1st-class goto"></div>
Now, how can I check the div if the class name has goto?
Give the div an id :
<div id="target" class="1st-class goto"></div>
Then do:
if ($('#target').hasClass('goto')) {
alert('Has class goto');
}
Note: You don't need to give the div an Id. You can use the .1st-class selector as well. However, giving it an Id makes it uniquely identifiable if you have multiple divs with the class 1st-class.
References:
jQuery hasClass()
OK, I know how to add class as well as detect the class of the div in jQuery but now I want to get the class name of the child inside the parent div and then add a class or id to the parent div that hold the child div.
example:
<div>
<div class="childdiv">this is the child divident</div>
</div>
after the div child class has been get or detected then add class or id to the parent div (in my case, I use class)..
the output should be:
<div class='parentclasshasbeenadded'>
<div class="childdiv">this is the childdiv</div>
</div>
This just an experiment, once this succeed then I'm going to apply this to my actual big bang project, please help me, thanks in advance.
PS: I'm open to any suggestions, recommendations and ideas.
You could also do
$('div :has(".childdiv")').addClass('parentclasshasbeenadded');
$('.childdiv').parent().addClass('parentclasshasbeenadded');
Above will add class=parentclasshasbeenadded to parent of .childdiv
and to add id:
$('.childdiv').parent().attr('id', 'someid');
To detect class exists you need to use hasClass()
$('div').children().each(function() {
if($(this).hasClass('childdiv')) {
// to add class
$(this).parent().addClass('parentclasshasbeenadded');
// to add id
$(this).parent().attr('id', 'someid');
}
});
if($(this).children().hasClass("childdiv")) {
$(this).addClass("Thaparentclasshasbeenadded")
}
this might help to figure things out.
$('.parent .child')[0]{
//there is
}