Only img change inside li children

Say my code looks like this:

<ul>
   <li><img /></li>
   <li>
      <ul>
         <li><img /></li>
      </ul>
   </li>
</ul>

      

I'm trying to set the default size for the first tag img

, but it doesn't affect the second. everything I do affects the other. I have currently tried:

$('ul#gallery > li').find('img').css('width','650px');
$('ul#gallery > li img').css('width','650px');

      

among others, but nothing works.

+2


a source to share


3 answers


$('ul#gallery > li > img').css('width','650px');

      



0


a source


Have you tried using jQuery selector :first

?

$("li img:first").css('width','650px');

      



0


a source


I don't see id="gallery"

in your example, but I assume the following code (only the outer one <ul>

has gallery

id):

<ul id="gallery">
   <li><img /></li>
   <li>
      <ul>
         <li><img /></li>
      </ul>
   </li>
</ul>

      

then the corresponding CSS selector ul#gallery > li > img

.

0


a source







All Articles