0

I would like to know how I can make a class in JavaScript type dot using CSS properties.

This is the CSS code that I have in HTML:

.dot3 {
    height: 25px;
    width: 25px;
    background-color: #FFFF00;
    border-radius: 50%;
    display: inline-block;
}

This is what I am trying in JavaScript:

.dot2 {
    height: 25px;
    width: 25px;
    background-color: #FF0000;
    border-radius: 50%;
    display: inline-block;
}

database.once('value', function(snapshot){
    if(snapshot.exists()){
        var content = '';
        snapshot.forEach(function(childSnapshot){
            var val = childSnapshot.val();
            //content +='<tr>';

            if (val.Distancem2 > 15 &&  val.DistanceMiddle1 > 15 && val.DistanceMiddle3 > 15){

                content +='<div>';
                content += '<span>' +class="dot2"+'</span>';
;
                content +='</div>';
            }

        });
        $('#div').append(content);
    }
});
fiza khan
  • 1,280
  • 13
  • 24
VanchyTechMer
  • 25
  • 5

1 Answers1

1

You're almost there:

content += '<span class="dot2"></span>';

I also don't think append works like that, but you need to create the element first with document.createElement('div') and then append the element, but I guess you can just use innerHTML instead for your solution:

$('#div').innerHTML += content;
Rickard Elimää
  • 7,107
  • 3
  • 14
  • 30
  • Do not work. My new code is: content +='
    '; content += ''; content +='
    '; } }); $('#div').innerHTML += content;     – VanchyTechMer Apr 30 '19 at 04:52
  • And you're aware that your CSS code is .dot3 and not .dot2? I'm not that into creating CSS code throught javascript, but if you really want to do it, you need to use `createElement` and create a STYLE element, add CSS to it through `innerHTML`, and append the STYLE element to the HEAD. I will flag this thread with a link to another thread with a similar question. – Rickard Elimää Apr 30 '19 at 04:59
  • The .dot 3 is in the HTML and in javascript is .dot2 I want the element .dot2 to be created through javascript and not HTML – VanchyTechMer Apr 30 '19 at 05:05