-4

Actually I'm working with a Events CMS (it's Eventtia.com), it allows me to make a basic UI (I'm not happy with that). I want to modify some styles, and it's working using new classes and so on.

I want to overwrite a div class using JavaScript (not JQuery) to force the web browser render the new class on the div. To be clear the div doesn't have an id. So I can't use getElementById(id_name)

<div class="col-md-3 margin_auto">

I want to change to (change the bootstrap class from col-md-3 to col-md-4) using JavaScript.

<div class="col-md-4 margin_auto">

At the end the WebBrowser gonna render the new class col-md-4 margin_auto

How could I do that?

marcode_ely
  • 434
  • 1
  • 5
  • 18
  • 1
    JavaScript add and remove class... So what is your issue? Select it with querySelector and alter the class. – epascarello Dec 12 '17 at 20:26
  • 2
    Possible duplicate of [Change an element's class with JavaScript](https://stackoverflow.com/questions/195951/change-an-elements-class-with-javascript) – 4castle Dec 12 '17 at 20:34
  • No it doesn't, my div doesn't have a id to use getElementById – marcode_ely Dec 12 '17 at 20:41
  • Then you need to find the element by some other means, and you haven't given us much to work with. Your question really isn't how to change the class of an element, because the link covers that, but how to obtain a reference to that element. You haven't provided enough context here to answer that. – jmoerdyk Dec 12 '17 at 20:46

2 Answers2

0

Thanks a lot to all guys for help me here. Unfortunately some guys vote negative and some point of my score goes down (I was 14 pts), but ok.

This is the solutions of my code:

var elemento = document.getElementsByClassName("col-md-3 margin_auto");
var elemento2 = document.getElementsByClassName("col-md-8 col-md-offset-1");


for(var i=0; i < elemento.length; i++){
  elemento[i].className = "col-md-4 margin_auto" //<- My final class to assign
}
for(var i=0; i < elemento2.length; i++){
  elemento2[i].className = "col-md-7 col-md-offset-1" //<- My final class to assign
}

Thanks a lot guys.

marcode_ely
  • 434
  • 1
  • 5
  • 18
  • Take a look at `querySelector()` and `querySelectorAll()` to select the element(s) and `classList` to add and remove a single class. This would make it easier and cleaner. – ssc-hrep3 Dec 12 '17 at 21:28
-2

You can do this:

var el = document.getElementsByTagName('div')[0];

el.className = 'new class to element';

César Felipe
  • 111
  • 3