Geben Sie jedem Element eine eindeutige ID und greifen Sie mit jquery darauf zu

Question

Ich versuche, die Echtzeitausgabe basierend auf Benutzereingaben für eine Suche zu drucken. Ich versuche also, den Titel jedes Ergebnisses zu einem div-Element bestimmter Breite und Höhe hinzuzufügen. Ich möchte die Einträge jedes div-Elements auf 8 begrenzen. Für verschiedene Suchvorgänge wird die Anzahl der anzuzeigenden divs variieren. Ich benutze den folgenden Code, da #test nicht eindeutig ist, wird der gesamte Ausgabetitel in einem einzigen div anstelle von divs mit jeweils 8 Titeln angezeigt .. Ich möchte wissen, dass wir ein Div mit eindeutiger ID erstellen und die jquery verwenden können Funktion, um Titel zu diesen eindeutigen divs hinzuzufügen .. wie mache ich das?

 
for(var count5=0;count5 

{ $(".panel1").append('<div id="test" style="width:200px; height:120px; background-color:#000000; float:left; margin-left:10px; margin-top:10px; color:#ffffff;"></div>'); 

    for(count4=num; count4<num1; ++count4) 
    { 
      $("#test").append(prsnArray[count4].term + '<br>'); 
    } 
num=num+8 
num1=num1+8} 

Answer 1

Anstatt die Bedingungen in Ihrer Person Array auf die div mit id ‚test‘ anhängt (die nicht eindeutig zuzuordnen sind, wie es sein sollte), diejenigen, in die neu geschaffene div anhängen.

var $newDiv = $('<div style="width:200px; height:120px; background-color:#000000; float:left; margin-left:10px; margin-top:10px; color:#ffffff;"></div>') ; 
$(".panel1").append($newDiv); 

for(count4=num; count4<num1; ++count4){ 
    $newDiv.append(prsnArray[count4].term + '<br>'); 
} 

Answer 2

Fist off, fixieren Sie Ihr Markup! <br> sieht hässlich aus, Sie sollten Listen oder Definitionslisten verwenden.

für die ID des div Sie eine globale Variable als Zähler verwendet werden könnte und concaternate, dass mit einem id wie

myvar++; 
$('#test'+myvar).doSth(...) 

oder Sie könnten eine Klasse zum div

<div id="test1" class="mydivs"> ... </div> 

und fügen Sie dann

var newid = $('.mydivs').length + 1; 
while($('#test'+newid).length > 0){newid++;}