Нужна помощь по Модальному окне js

[1Feniks1]

<script>
function toggle(el) {
el.style.display = (el.style.display == 'none') ? '' : 'none'
}
function modal(el) {
el.style.display = (el.style.display == 'none') ? '' : 'none'
}
</script>

<ul>
     <li><a onclick="toggle(hidden_content)" href="#">Ответы<span class="activ">(+1)</span></a></li>
</ul>
<p onclick= "modal(mod_okno)" >Пробный текст</p>
<div id="mod_okno" style="display: none;">
<form>
<textarea name="message"> </textarea>
</form>
</div>

В случае если пропишу еще один раз второй код он не работает!
Пример вот так этот код уже не работает:

<script>
function toggle(el) {
el.style.display = (el.style.display == 'none') ? '' : 'none'
}
function modal(el) {
el.style.display = (el.style.display == 'none') ? '' : 'none'
}
</script>

<li><a onclick="toggle(hidden_content)" href="#">Ответы<span class="activ">(+1)</span></a></li>
<p onclick= "modal(mod_okno)" >Пробный текст</p>
<div id="mod_okno" style="display: none;">
<form>
<textarea name="message"> </textarea>
</form>
</div> 
<div id="mod_okno" style="display: none;">
<form>
<textarea name="message"> </textarea>
</form>
</div>

[KosBeg]

ID должен быть уникальный!
а в втором варианте
1) <div id="mod_okno" style="display: none;">
2) <div id="mod_okno" style="display: none;">
дважды используется id="mod_okno"
используйте класы!

<p onclick= "modal(document.getElementsByClassName('mod_okno_1')[0])" >Пробный текст 1</p>
<div class="mod_okno_1" style="display: none;">
<form>
<textarea name="message"> </textarea>
</form>
</div> 
<p onclick= "modal(document.getElementsByClassName('mod_okno_2')[0])" >Пробный текст 2</p>
<div class="mod_okno_2" style="display: none;">
<form>
<textarea name="message"> </textarea>
</form>
</div>

<script>
function toggle(el) {
  el.style.display = (el.style.display == 'none') ? '' : 'none'
}

function modal(el) {
  el.style.display = (el.style.display == 'none') ? '' : 'none'
}
</script>

[1Feniks1]

То для каждого окна который будет добавляться нужно еще писать другой class?

[KosBeg]

То для каждого окна который будет добавляться нужно еще писать другой class?

в КАЖДОГО окна должен быть УНИКАЛЬНЫЙ ID, а если это КЛАСЫ то можно и не уникальниый
я на быструю руку написал через класы, можно и через ID, но если это ID - ОН ОБИЗАТЕЛЬНО ДОЛЖЕН БЫТЬ УНИКАЛЬНЫЙ

<p onclick= "modal(mod_okno_1)" >Пробный текст 1</p>
<div id="mod_okno_1" style="display: none;">
<form>
<textarea name="message"> </textarea>
</form>
</div> 
<p onclick= "modal(mod_okno_2)" >Пробный текст 2</p>
<div id="mod_okno_2" style="display: none;">
<form>
<textarea name="message"> </textarea>
</form>
</div>

<script>
function toggle(el) {
  el.style.display = (el.style.display == 'none') ? '' : 'none'
}

function modal(el) {
  el.style.display = (el.style.display == 'none') ? '' : 'none'
}
</script>

[1Feniks1]

Угу! Ну спасибо! Очень хорошо ты мне помог! Я уже весь день искал..! Спасибо еще раз!
Ну я дальше писать
А тебе +

[demoniqus]

5 копеек про ID - обработка зависит от браузера. Некоторые браузеры в случае неуникальных ID берут первый попавшийся, а некоторые вообще посылают к рогатому вся и всех. Поэтому ID стоит лишний раз не использовать, если есть сомнения в его будущей уникальности...