Question

I am trying to select a image inside a link.

JQUERY:

$('#selskaber img').hover(function () {
    $(this).next().css({'border' : '1px solid #0167B0 !important'});
  }, 
  function () {
    $(this).next().css({'border' : '1px solid #CCCCCC !important'});
  }
);

HTML:

<div id="selskaber">
    <a target="_blank" href="#">
    <img style="border:none;" src="/images.pmg" alt="Telenor">
    </a>
</div>

UPDATE:

I have removed the next(). Still no border is added.

My CSS:

#wrap #selskaber a {border:none;margin-left:10px;display:inline-block !important;
    height: 41px;
    margin-top: 5px;
    width: 150px;}

Answer 1

That image doesn’t have any sibling, so next won’t give you anything.

If you’re trying to select the img, just remove the next()

    $('#selskaber img').hover(function () {
    $(this).css({'border' : '1px solid #0167B0 !important'});
      }, 
      function () {
        $(this).css({'border' : '1px solid #CCCCCC !important'});
      }
    );

next:

Description: Get the immediately following sibling of each element in the set of matched elements. If a selector is provided, it retrieves the next sibling only if it matches that selector.