Introduction

Javascript sucks, so we made it worse. This library adds simple functions to control the HTML DOM.
Ut2l defines two main variables: util and _. util has many different uses, and is the main highlight of the library. _ is just a shorthand/alias to util.

Simple Usage

Find an element

// function parameters: util(a, b, c)

_(".foo") // same as document.querySelector
_(".foo", 2) // gets the third element with the class "foo" and mods it.
_(".foo", (element, index) => {}) // runs the callback function for every element and mods each one.
_(".foo", 2, (element) => {}) // runs the callback function once, for the third element with the class "foo" and mods it.
_("#bar") // gets element by id and mods it.
_("p") // grabs the first <p> tag in the DOM and mods it.
_(existing_html_element) // returns the wrapped element.
// Modding elements: adds certain properties which makes it easier to modify the element (e.g. .css(), .text())

Create an element

// function parameters: util.create(type).set...

const bar = _.create("div")
  .setInnerHTML("innerhtml") // sets the InnerHTML
  .setClassList(["a", "b"]) // sets the FULL classlist
  .addClass("c") // adds a class to the classlist
  .addAttribute("property", "value") // adds an attribute
  .setId("foo") // sets the id
  .render(); // renders the element

document.body.append(bar); // append the element to the body

Pick random

// function parameters: util.randInt(min, max), util.randFloat(min, max, decimalPlaces), util.randPick(collection [array/obj])

_.randInt(1, 10) // int 1-10
_.randInt(10) // int 0-10
_.randFloat(1, 10, 2) // float 1-10, 2 decimal places
_.randFloat(1, 10) // float 1-10
_.randPick(['a', 'b', 'c']) // picks a random value from array
_.randPick({
  "a": 1,
  "b": 2,
  "c": 3
}) // picks a random value from object

document.body.append(bar); // append the element to the body

Full Documentation