Develop Reference

Select a div insinde another div with jQuery

So I try to select a div within another div. My html goes like this:
<div id="Stage_game_page1"><div id="cube0">[...]</div><div id="cube1">[...]</div></div>
I want to select my #cube0 within my Stage_game_page specifically, with jQuery or JS.
The goal of the selection is to use it in an loop.
I tried :
var count =$("#Stage_game_page").children().length;
for(i=0; i<count;i++){
$("#Stage_game_page")$("#cube"+i)[...]
}
I don't understand what I'm doing wrong.

var count =$("#Stage_game_page").children().length;
for(i=0; i<count;i++){
$("#cube"+i);
}
This is sufficient to select the "#cube0"/"#cube1"/"#cube2" etc. especially since ids are always unique. To answer the question $("#cube0", "#Stage_game_page")... that is how you select a div in another div

The id attribute should only be used once! I see above that you're using id="cube0" twice. If you want your divs to be recognized in multiple instances, use a class instead (the . instead of the #). Using the same id twice will probably break your script.
I believe for your html, you could use id "cube0", "cube1", etc., as long as you're ok with entering them manually. That should work for the loop you'd like to use.

Loops through each div that starts with the id cube inside Stage_game_page1
$("#Stage_game_page1 > div[id^='cube']").each(function () {
alert($(this).html());
});
JSFiddle
Child Selctor
Starts with Selector

use each() for loop.
$('#Stage_game_page1').children().each(function(index) {
// your code here with index starts from 0
});
or this using jquery attribute starts with selector
$('#Stage_game_page1').find('[id^="cube"]').each(function(index) {
// your code here
});

You need to use .find() or .children() or the like.

The correct jQuery usage would be
$("#Stage_game_page").find('#cube'+i)
to find a div with that id inside the container #stage_game_page

You have duplicate cube0 in your html code..
and i think the look should contain something like that:
$("#cube"+i)[...]

One another solution is:
$("#Stage_game_page1 div[id='cube0']")

How to check if class attribute exist?

I'm trying to check if there is no class tag within a <li> </li> tag.
For example, if I have this:
<li class="menu...."> words </li>
I want to ignore it. However if I have this:
<li> words </li>
I want to use it.
What I currently have is something along the lines of:
$("li").each(function() {
if ($(this).classList.contains('') {
do function
}
})
However, this is not working - how would I go about doing this?
Thanks in advance

$('li:not([class])');
This will select all li elements without a class at all. You can replace [class] with a specific class as well, or use hasClass.

You can do this:
$("li:not(.menu)").whatever();
That's not the fastest way necessarily; it may be faster to do this:
$("li").filter(function() { return !$(this).hasClass("menu"); }).whatever()
edit if you want to operate on <li> elements that have no class, then just check the .className property:
$("li").filter(function() { return !$(this).prop("className"); }).whatever()
However, I would suggest that that's not a good coding pattern. It's fragile because it relies on any future changes to your page for purposes completely unrelated to what you're doing now not involving the addition of a class. You'd be better off explicitly checking for specific classes that you're not interested in.
Like, maybe 3 months from now, somebody decides that all the list items that are about penguins be made black and white. You then add the class "penguin" to all those <li> elements. If you don't remember this change you're making now, all of a sudden that functionality will be broken.

You can use prop()
$("li").each(function() {
if (!$(this).prop("class")) {
doFunction();
}
});
DEMO

The classList is only available on Element instances, not on the jQuery object.
$("li").each(function() {
if (this.classList.length === 0) {
do function
}
})

jquery continuously check if element has specific attribute and do something

I want to hide a div when an a has a specifc href and show it when it doesn't have that specifc href
I've tried this:
if($('a[href="#intro"]').not(".active"))
{ $('.navbar-brand').hide();}
else {$('.navbar-brand').show();}
But this is not working as expected, it hides that div when that specific href has a class of active.
What am I doing wrong ?

Try this
var show = $('a[href="#intro"]').hasClass('active');
$('.navbar-brand').toggle(show);

I think you don't use well :not see https://api.jquery.com/not-selector/
if($('a[href="#intro"]:not(".active")')
{ $('.navbar-brand').hide();}
else {$('.navbar-brand').show();}

jquery- store id of clicked link in variable

This should be basic, but for some reason its not working for me. I just want to store the id when a link that has a certain class is clicked in a variable so as an example:
Some link
I would want jquery to get the id of the link above and store it in a variable. I have tried $this.attr("id") and $this.id, but non of this worked.
This is what I have for the jquery:
$(".only_this_class").click(function() {
var clickedId= $(this).attr("id");
alert(clickedId);
});
I just get "undefined" every time.

I removed the space between this and _class in class="only_this _class" and it is working for me.
Try this here
Please have a look at jQuery Selectors
If you have two classes in your HTML then the syntax is different:
$('.classA.classB')
Have a look at How can I select an element with multiple classes?

NAVEED is right, if you remove the space it works, because if there is a space HTML will put two classes on the element: only_this and _class.
If you are in fact looking for two different classes, you should replace the space with a dot to make it work properly, as in $(".only_this._class")

$(".only_this _class") this selector will look for _class tag in .only_this element. May you are looking for $(".only_this") which will select element which has this class. Try this.
$(".only_this").click(function() {
var clickedId= $(this).attr("id");
alert(clickedId);
});

Use jQuery to remove a <p> with an empty <span> tag

I'm working on a Wordpress build using the Tubepress plug-in. This plug-in inserts an unwanted <p> above the video content. I'd like to remove this tag using jQuery.
Here's the code I'd like to remove:
<p><span id="more-76"></span></p>
The span id is auto-generated and will be different for each piece of content. This code is placed in the following div.
<div class="work1alt">
<p><span id="more-76"></span></p>
</div>
Thanks in advance for help.

Like this:
$('span:empty:only-child').parent('p').remove();
This will be extremely fast, but will not select <span>s with whitespace in them.

$('div.work1alt').find('p span:empty').parent().remove();

The first if condition checks if there is no children or content I believe. The second checks if the span contains empty text and will return only text within the span, but not it's children.
Not as elegant and probably not as fast as slak's solution, but is very explicit.
$('div.work1alt > p span').each(function(){
if($.trim($(this).text()) === ""){
$(this).parent().remove();
}
});
EDIT: forgot to put the '===""' in the ifs (doh!)

depends on what else stands on your page. Maybe you should try this like that $('p').remove();