jQuery. Why are none of my css class values present when I assign a css class?

Question

I create and append a div with an id:

classyDiv = document.createElement('div');
classyDiv.setAttribute('id', 'classyDivID');

parentDiv = document.getElementById('parentDivID');
parentDiv.appendChild(classyDiv);

I now want to attach this css class to the child div:

.igv-top-left-width {
    position: absolute;
    top: 128px;
    left: 256px;
    width: 512px;

}

I use jQuery to assign the css class:

$('#classyDivID').addClass('.igv-top-left-width');
console.log($('#classyDivID').css('left'));

When I echo the css class values I get complete nonsense values. For left I get auto. Huh? Whah?. As if I am referring to some other random css class. What am I doing wrong here?

Answer 1

Try to change:

$('#classyDivID').addClass('.igv-top-left-width');

to:

$('#classyDivID').addClass('igv-top-left-width');

You don't need the . to add the class here