Как скрыть все дивы, кроме одного в модальном окне?

Question

[⁣ ⁣]

Нужно, чтобы при открытии модального окна в index.html, открывалась страница hello.html и сразу же только с дивом class="2" id="2", а остальные были скрыты.

index.html

<a href="hello.html" rel="modal">Hello!</a>

<div id="modal" class="modal fade" 
     tabindex="-1" role="dialog" aria-labelledby="plan-info" aria-hidden="true">
    <div class="modal-dialog modal-full-screen">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" 
                  data-dismiss="modal" aria-hidden="true">
                  <span class="glyphicon glyphicon-remove-circle"></span>
                </button>
            </div>
            <div class="modal-body">
                <!-- /# content goes here -->
            </div>
        </div>
    </div>
</div>

hello.html

<div class="1" id="1"><p>Hello</p></div>
<div class="2" id="2"><p>My</p></div>
<div class="3" id="3"><p>World</p></div>

main.js

$('a[rel=modal]').on('click', function(evt) {
    evt.preventDefault();
    var modal = $('#modal').modal();
    modal
        .find('.modal-body')
        .load($(this).attr('href'), function (responseText, textStatus) {
            if ( textStatus === 'success' || 
                 textStatus === 'notmodified') 
            {
                modal.show();
            }
    });
});

Comments

[Максим Тимофеев]

перебрать все дивы и сделать им hide?

[⁣ ⁣]

Максим Тимофеев: Да. можно попробовать через hide.

Answer 1

[⁣ ⁣]

Решил проблему. Добавив скрипт скрывающий все блоки в модальном окне с классами ="block"

<div id="modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="plan-info" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                  X
                </button>
            </div>
            <div class="modal-body">
				
                <!-- /# content goes here -->
						<script>
				                      $(".block").hide();                
				                </script>
            </div>
        </div>
    </div>
	</div>