CODEWITHSUNDEEP
htmlcss
marcamillion
marcamillion

Reputation: 33755

How do I select an image within two <div> tags?

Code is as follows:

<div id="compare_view" align="center">

    <div id="compv-navbar">
        <img src="image1.png"> | <img src="image2.png"> | <img src="image3.png"> | Text can be here
    </div>    
</div>

I would like to be able to manipulate all of the images within the 'compv-navbar' div.

I know I could give each image a unique ID and select them that way, but I want to manipulate all the images within that compv-navbar div at the same time.

Edit: Sorry, I would like to select it with CSS. I thought it was obvious from the tags.

Upvotes: 1

Views: 6037

Answers (4)

Free Consulting
Free Consulting

Reputation: 4402

/*
query for id compv-navbar and populate NodeList collection with all <img> children
NOTE: since ids _required_ to be unique within the document, asking for compare_view first is redundant
*/
var nodeList = document.getElementById( 'compv-navbar' ).getElementsByTagName( 'IMG' );
for ( var i = 0; i < nodeList.length; i++ )
  nodeList[ i ].title = 'Here is my image!'

huh, no longer has JS flavour?

#compare_view>#compv-navbar>img { content: "here WAS my image" }

Again, selector is over-specific

Upvotes: 0

meder omuraliev
meder omuraliev

Reputation: 186562

#compare_view #compv-navbar img { }

The first id isn't really necessary but makes it more specific and linear-like. You can go ahead and just use #compv-navbar img if you want.

If you want to manipulate with javascript, getElementById on #compv-navbar and getElementsByTagName('img') using that as a context.

jQuery-wise it would be $('#compv-navbar img')

Upvotes: 4

RWGodfrey
RWGodfrey

Reputation: 867

Take a look at the JQuery "each" method: http://api.jquery.com/jQuery.each/

Upvotes: 1

Ian Wood
Ian Wood

Reputation: 6573

#compv-navbar img { 'your schnizzzle' }

Upvotes: 1

Related Questions