-1

I have an html string that looks like this :

'<p>Hello</p><p>I would like to schedule a meeting with you.</p>
 <a class="button button--blue" href="#">
   <button class="button 
      button--blue">Schedule meeting
   </button>
 </a>
 <p>See you soon.</p> 
 <p>baher</p>',

How can i access these elements individually to add a class to them without using jQuery? please note that i'm working on the server side so stuff like document and window are not accessible

Mohamed Baher
  • 151
  • 1
  • 9
  • Which one specifically? – lealceldeiro Jul 09 '18 at 15:29
  • 2
    It's just a string so you can't "access" it until it's interpreted by the DOM. to do so easily you can use `document.body.innerHTML = your_string` and then just use regular querying methods like `querySelector` and `querySelectorAll` – zfrisch Jul 09 '18 at 15:31
  • Possible duplicate of [Converting HTML string into DOM elements?](https://stackoverflow.com/questions/3103962/converting-html-string-into-dom-elements) – Lewis Jul 09 '18 at 15:32

2 Answers2

0
<p id="hello">Hello</p><p>I would like to schedule a meeting with you.</p>
<a class="button button--blue" href="#">
<button class="button button--blue">Schedule meeting
</button>
</a>
<p>See you soon.</p> 
<p>baher</p>'

<script>
var hello = document.getElementById("hello");
hello.classList.add("mystyle");
</script>
Bill Zelenko
  • 2,606
  • 1
  • 17
  • 26
  • 2
    He is working with a string, not a DOM element. Because of that, this method (even if its right) won't work in this particular case. – enbermudas Jul 09 '18 at 15:37
0

you can access #document methods on server side as well just you need to properly link files . on whatever server side language you are working there is a method to add dynamic data lets say you are working on node.js with handlebars templating engine then you can do something like this

<div {{if conditn_true}} class="anyname" {{/if}}></div>

if you are using php then

<div class="<?php something related to class ?>" ?> ></div>

other dom methods

var element = document.getElementById("myDIV");
    element.classList.add("mystyle");

hope this helps...be more specific on what exactly you are trying to achieve by mentioning some code snippet so that we can further help you