adding html element using js

Question

I have generated html content

<a href="/images/img1.jpg" target="_blank">
   <img src="/images/img1.jpg" alt="asdsadasdsa" />
</a>

how can I on dom ready use image alt content (in this case asdsadasdsa) and add new attribute title with alt image content, in other words above html should be

<a href="/images/img1.jpg" target="_blank" title="asdsadasdsa">
    <img src="/images/img1.jpg" alt="asdsadasdsa" />
</a>

js should target only code which has target="_blank" as part of a href attribute.

Tushar Gupta - curioustushar · Accepted Answer · 2013-11-09 11:21:08Z

4

Try

$('a[target="_blank"]:has(img[alt])').attr('title', function () {
    return $(this).find('img').attr('alt');
});

DEMO - jsfiddle

Reference

:has()

.attr()

.find()

[ ] has-attribute-selector

edited Nov 9, 2013 at 11:21

answered Nov 9, 2013 at 11:10

Tushar Gupta - curioustushar

57.2k24 gold badges106 silver badges110 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

user2783193 Over a year ago

Thanks for your time, but I should target only links which has target="_blank" like <a href="/images/img1.jpg" target="_blank" ...

Jai · Accepted Answer · 2013-11-09 11:29:03Z

1

You can try with this:

var $target = $('a[target="_blank"]');
var $content = $target.find('img').attr('alt');

$target.attr('title', $content);

or this way:

var $target = $('a[target="_blank"]');

$target.each(function(){
    $(this).attr('title', $(this).find('img').attr('alt'));
});

Demo Fiddle to try

answered Nov 9, 2013 at 11:29

Jai

74.8k12 gold badges77 silver badges104 bronze badges

Collectives™ on Stack Overflow

adding html element using js

2 Answers 2

1 Comment

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Related