JQuery - как получить HTML внутри DIV

Question

У меня есть этот HTML:

<div class="portlet-header">
    Company Information ... <button> some button here </button>
</div>
<div class="portlet-content">
    <div class="content_regular">
        <table style=" width:100%; height:100%;">
            ...content
        </table>
    </div>
</div>

как получить html после нажатия кнопки в части заголовка портлета, в данном случае тега таблицы?

У меня есть этот код jquery для получения текста в заголовке: $(this).parent().text();, но нигде не удалось получить html в классе "content_regular", как показано выше.

Надеюсь, твоя мудрость поможет мне с этим. я знаю это очень легко для других, но я не знаком с jquery.

спасибо

Answer 1

Используйте .next(), чтобы получить от .portlet-header до .portlet-content, затем используйте .html() вместо .text() для получения содержимого,например:

$(".portlet-header").click(function() {
  var html = $(this).next(".portlet-content").html();
});

Если между элементами div, другим элементом и т. д. может быть что-то, используйте взамен .nextAll(), например: .nextAll(".portlet-content:first")

Answer 2

Сначала используйте функцию html() вместо функции text(). Во-вторых, наведите курсор на правый узел, например, .portlet-content .content_regular table. Я позволю вам сделать объединение этих двух самостоятельно.

Answer 3

$('.portlet-header button').click(function(){
   alert($('.content_regular').html())
});

хорошие показания

1. .html ()
2. jQuery селекторы
3. Обход

вот демо