Question

I have several iframes on the page. There are some elements with classname test inside of them. I need to set any style to them.

When I have only one iframe, I can use next construction:

$('#iframeId').contents().find('.test').css({background: '#f00'});

But I have several iframes, so it would be great not to set concrete iframe and use construction like:

$('.test').css({background: '#f00'});

But it doesn’t work, of course.

I used native getElementsByClassName before, but it doesn’t work in IE8, where defect appears.

It may be stupid question, but.. Is there any construction like:

$(getElementById('something')).css({background: '#f00'});

It would be very helpful. I mean, wrap JavaScript object with jQuery and then use jQuery methods with them.

Update: I solved this problem with next construction:

[].forEach.call(document.getElementById('something').querySelectorAll('.test'), function (el) {
    el.style.backgroundColor = '#f00';
});

But it’s still doesn’t work for IE8.

Answer 1

You should try some thing like this

$("iframe").each(function(index){
   $(this).contents().find('.test').css({background: '#f00'});
});

Hope this will help you.