Append jquery error

Question

I'm having problems with the append command of this code and I still can not identify, the browser does not return any error message. I believe the problem is in $containerDeImagens

$(document).ready(function(){
  var $parent = $('<div/>',{
                   'class': 'slideshow-container'                   
                });

  var $containerDeImagens = $('<div/>', {'class': 'mySlides fade'});

  var $imagem = $('<img/>', {'src': 'http://4.bp.blogspot.com/-WdeIPau46H8/UAYgCWkbh3I/AAAAAAAADZI/lgaMcaUtZV8/s1600/quadrado+azul.jpg',
                    'class': 'imgAnuncio'                       
                });                         

  var $marcador = $('<span/>', {'class': 'dot' });              

  $containerDeImagens.append($imagem);                  
  $containerDeImagens.append($marcador);                    
  $parent.append($containerDeImagens).appendTo('.alinharTamanho');                  

});

https://jsfiddle.net/abu8uL35/1/

Answer 1

It should work if you have an existing element with the class alinharTamanho in your DOM.

i.e.

    <div class="alinharTamanho">

$(document).ready(function() {

  var $parent = $('<div/>', {
    'class': 'slideshow-container'
  });

  var $containerDeImagens = $('<div/>', {
    'class': 'mySlides fade'
  });

  var $imagem = $('<img/>', {
    'src': 'http://4.bp.blogspot.com/-WdeIPau46H8/UAYgCWkbh3I/AAAAAAAADZI/lgaMcaUtZV8/s1600/quadrado+azul.jpg',
    'class': 'imgAnuncio'
  });

  var $marcador = $('<span/>', {
    'class': 'dot'

  });

  $containerDeImagens.append($imagem);
  $containerDeImagens.append($marcador);
  $parent.append($containerDeImagens).appendTo('.alinharTamanho');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="alinharTamanho">
</div>

Edit: issue in fiddle

you are setting this css

.mySlides {
    display: none;
}

which is causing the image to be hidden.

either do not add this class in $containerDeImagens

var $containerDeImagens = $('<div/>', {
                    'class': 'mySlides fade'
                });

or change the css.