How can I add attributes to html code inside of a javascript variable?

Question

Through the following html and js code

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<script>
var get = $(".parent").html();
// Now I want to add some properties to div with "hello-world-2" class in html code of get variable
</script>
</head>
<body>
<div class="parent">
<div class="hello-world">
            <div class="hello-world-2">
           <h1 class="hello-world-3" style="padding-top:10px;">simple</h1>
            </div>
            <div class="hello-world-4">
            </div>
        </div>
</div>
</body>
</html>

Here I want to add some properties such as id to the div or adding another div inside the div with class "hello-world-2" or add some cutom tags such as

h1 tag, img tag etc

Now I have the code of div inside html in "get" variable I want to add an id to div with "hello-world-2" class not to original code but to the hmtl code in get variable is it possible ? thanks

Welcome to Stack Overflow! Stack Overflow is not a discussion forum, it is a Question and Answer site where you can ask a specific programming question that can be answered rather than discussed. Please read How do I ask a good question? and What topics can I ask about here? and then edit your question to conform with the site guidelines. Off-topic questions such as this one are routinely closed, but if edited to ask an answerable question, can be re-opened again. Thanks. — NightOwl888
– NightOwl888, Commented Mar 4, 2018 at 3:45
I don't get what the problem is. He asked a spesific question: How to add a property to a element in javascript. His title is correct, his tags is correct... — Kickass
– Kickass, Commented Mar 4, 2018 at 3:55
Come on @NightOwl888, explain to me please what the problem is here. His post even meets your second links criteria. WHAT IS THE PROBLEM WITH THIS POST? — Kickass
– Kickass, Commented Mar 4, 2018 at 4:04
Ok, to be more specific 1) Not clear what is meant by "inside of a javascript variable" 2) "Is it possible?" is not a good question because it implies you only want a yes/no response 3) There are no examples of what has been tried. This is literally a give me teh codez question that shows no attempt has been made. — NightOwl888
– NightOwl888, Commented Mar 4, 2018 at 4:12
I agree to some extent, but this guys english 'not-so-good', we should still try to help. — Kickass
– Kickass, Commented Mar 4, 2018 at 4:15

Kickass · Accepted Answer · 2018-03-04 04:00:49Z

0

This should work:

var e1 = document.getElementById('someId').id = 'otherId';
var e2document.getElementsByClassName('hello-world-2')[0].id = 'someId';

var newElement = document.createElement('div');
newElement.id = 'someId';
newElement.classList.add('someClass');
newElement.setAttribute('custom-attr', 'ca');

var newElement2 = document.createElement('h1');
newElement2.innerHTML = 'HEADER';

e1.appendChild(newElement);
e2.appendChild(newElement2);

edited Mar 4, 2018 at 4:00

answered Mar 4, 2018 at 3:50

Kickass

1,15210 silver badges16 bronze badges

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

4 Comments

rammanoj Over a year ago

thanks @Juan Theron here I am using .html() tag to bring html code, is there any way to do it in jquery using adding some code to the comment I specified in code?

rammanoj Over a year ago

var get = $(".parent").html() brings the code "<div class="hello-world"> <div class="hello-world-2"> <h1 class="hello-world-3" style="padding-top:10px;">simple</h1> </div> <div class="hello-world-4"> </div> </div>" to get variable now I want to add some attributes to div with "hello-world-1" class this is my question

Kickass Over a year ago

The easiest would be to do $('.hello-world-1')[0].attr('title','test').

Kickass Over a year ago

My adice though would be to skip JQuery (why use it if it's not needed?) and just use plain old JS: document.getElementsByClassName('parent')[0].getElementsByClassName('hello-world-1')[0].setAttribute('title', 'test');

Collectives™ on Stack Overflow

How can I add attributes to html code inside of a javascript variable?

1 Answer 1

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related