У меня есть динамический созданный ящик, который должен появиться при щелчке. Он работает нормально, но css-таблица стилей не выбирает динамические элементы. См. Msg_head. Коробка состоит из msg_head, msg_body и msg_footer. Благодарю.
JS
var parent = document.getElementById('ft'); var mbox = document.createElement('div'); mbox.id='mb'; mbox.className='msg_box'; var mhead = document.createElement('div'); var mx = document.createElement('div'); mhead.id='bb'; mhead.className='msg_head'; mx.id='x' mx.className='close'; var mbody = document.createElement('div'); mbody.className = 'msg_body'; var mfoot=document.createElement('div'); mfoot.className='msg_footer'; var mheadall=mhead.appendChild(mx); mbox.appendChild(mhead).appendChild(mx); mbox.appendChild(mbody); mbox.appendChild(mfoot); parent.appendChild(mbox); var tt = $(this).text(); var dd = $(this).attr("id"); $("#bb").text(tt); $("#bb").attr("id",dd); }); }) CSS
.close { cursor:pointer; position:absolute; } .leftblock { position:relative; } .msg_box { display:inline-block; position:relative; bottom:-5px; height:200px; width:250px; background:white; border-radius:5px 5px 0px 0px; float:right; margin-right:35px; } .msg_head { background:#3498db; width:250px; color:white; padding:15px; font-weight:bold; cursor:pointer; border-radius:5px 5px 0px 0px; } .msg_body { background:white; height:200px; width:250px; font-size:12px; padding:15px; overflow:auto; overflow-x: hidden; } .msg_input { width:280px; border: 1px solid white; border-top:1px solid #DDDDDD; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .nameid { cursor: pointer; position:relative; padding:5px 10px; } .footer { position:fixed; left:20px; bottom:0; width:84%; height:342px; background:yellow; border-radius:5px 5px 0px 0px; overflow:hidden; overflow-y:hidden; }
HTML (с элементами PHP)
</html> <body> <div class="container"> <div class="header"> </div> <div class="leftblock"> </div> <div class="chat_box" id="cb"> <div class="chat_head">Members</div> <div class="chat_body"> <?php for($i=1;$usernamee=mysqli_fetch_assoc($records); $i++) { echo "<div class='nameid' id='$i' <b>".$usernamee['username']."</br>"."</b></div>"; } ?> </div> </div> <div id="ft" class="footer"> </div> </div> </body> </html>