# Styling HTML elements created in JavaScript

**URL:** <https://discourse.processing.org/t/styling-html-elements-created-in-javascript/2164>\
**Category:** Beginners\
**Created:** [July 28, 2018, 2:29pm UTC](https://discourse.processing.org/t/styling-html-elements-created-in-javascript/2164 "2018-07-28T14:29:21Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![LWoodall](https://avatars.discourse-cdn.com/v4/letter/l/dc4da7/32.png) [@LWoodall](https://discourse.processing.org/u/LWoodall)\
**Post date:** [July 28, 2018, 2:29pm UTC](https://discourse.processing.org/t/styling-html-elements-created-in-javascript/2164/1 "2018-07-28T14:29:22Z")

</div>

Hi

I was wondering how i’d be able to give elements like the ones I made with createP specific styling.

As a starting point i’d want to do something simple like make elements  
made from _createP(wants.wants[i].basic\_information.artists[0].name);_ bold but leave _createP(wants.wants[i].basic\_information.title);_ elements as they are, so they stand out from each other.

I’ve gone over things like this before but I think a lot of my confusion comes from knowing when elements should be created in HTML and when they should be made in JS. It seems like this is a case where I maybe should be making them in HTML but i’m not sure how to get the data from the source to HTML and where JS would come in to it.

Thanks

```auto
var wants;

function setup() {
  noCanvas();
  loadJSON('https://api.discogs.com/users/lee182jib/wants', getData);
}

function getData(data) {
  wants = data;
  for(var i = 0; i < wants.wants.length; i++) {
    createP(wants.wants[i].basic_information.artists[0].name);
    createP(wants.wants[i].basic_information.title);
  }
}

function draw() {

}

```

---

<div class="post-metadata">

**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\
**Post date:** [July 28, 2018, 2:39pm UTC](https://discourse.processing.org/t/styling-html-elements-created-in-javascript/2164/2 "2018-07-28T14:39:25Z")

</div>

> **[String.prototype.bold()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/bold)**
>
> The bold() method creates a b HTML element that causes a string to be displayed as bold.

> **[JSON Religions](https://bl.ocks.org/GoSubRoutine/9aa9cd00000e331612c8e557b5dd28f0)**
>
> GoSubRoutine’s Block 9aa9cd00000e331612c8e557b5dd28f0