Jquery：使用具有变量名称的类附加到 div

Question

So I'm working on a quick app that when you press a button, dog pictures show up. I want the pictures to appear in rows. So I started to create divs with the class 'dog row' and ended the name with a variable. While the creation of that div is successful. I can't seem to append anything to the div itself.

for (i=0; i<dogPool.length; i++){
            if (i%5 == 0){
            $('.dogTable').append(
                "<div class='dogLine dogRow" + rowNumber + "'></div>"
            );
            console.log("<div class='dogLine dogRow" + rowNumber + "'></div>");

                rowName = "'.dogRow" + rowNumber + "'";
                rowNumber++;
            }
            console.log("row: " + rowName);
            $(rowName).append(
                "<p>"+ i + "</p>"
            );
        }

Answer 1

The problem is here rowName = "'.dogRow" + rowNumber + "'";

You should fix like this

 var rowName = '.dogRow' + rowNumber;

 var dogPool = ["dog1", "dog2"]; var rowNumber = 0; for (i=0; i<dogPool.length; i++){ $('.dogTable').append( "<div class='dogLine dogRow" + rowNumber + "'></div>" ); console.log("<div class='dogLine dogRow" + rowNumber + "'></div>"); var rowName = '.dogRow' + rowNumber; rowNumber++; $(rowName).append( "<p>"+ i + "</p>" ); }

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="dogTable"> 123 </div>