Search code examples
moovwebtritium

In Tritium, how do I set a CSS class as a variable?

I'm using the Moovweb SDK, and writing Tritium to modify my HTML.

How do I save a CSS class as a variable?

I want to grab an existing class and apply it to other elements.

Solution

  • You can use the fetch tritium function to get the value of the class attribute in the element you're looking for and store it in a variable.

    So given the following html:

    <html>
  <head>
    <title> Tritium Tester </title>
  </head>
  <body>
    <div id="one" class="random"></div>
    <div id="two"></div>
   </body>
</html>

    You could write the following Tritium:

    html() {
  $("/html/body") {
    $class_name = fetch("./div[@id='one']/@class")
    $("./div[@id='two']") {
      add_class($class_name)
    }
  }
}

    Here's a live example link: http://play.tritium.io/331dfa6d01a7dd52261a9eaf812bdc5c7fb8c293