자바 스크립트 | JS를 사용하여 해당 div에서 다른 HTML을 변경하지 않고 div 텍스트를 편집하십시오.

사용자가 메뉴 (표시되지 않음)에서 필터를 추가 할 수있는 "leftnav"메뉴가 있습니다. 사용자가 필터를 추가하면 leftnav는 또 다른 "행"또는 class = "filters"가있는 div를 얻습니다.

각 div.filter는 여러 div를 보유합니다. 이 중 하나는 "버튼"또는 "="와 같은 텍스트 피연산자를 포함하는 클래스 이름이 "btn2"인 div입니다.

http://jsfiddle.net/bf8ugef7/6/

처음에 div.btn2 텍스트는 "="로 설정됩니다. 그러나 사용자는 "="를 마우스로 가리키면 피연산자의 전체 메뉴를 볼 수 있습니다. jsfiddle은 "="및 ">"라는 두 가지 옵션 만 표시합니다. 사용자가 ">"를 클릭하면 div.btn2 텍스트가 ">"를 표시하도록 업데이트해야합니다.

그러나 btn2.parentNode.parentNode.innerHTML = ">"를 사용할 수 없습니다. 이는 남아 있어야하는 ul li 메뉴를 효과적으로 삭제하기 때문입니다.

따라서 ul li을 건드리지 않고 div 텍스트 만 업데이트해야합니다. 이것이 가능한가?

innerText 및 textContent를 시도했지만 작동하지 않습니다.

감사합니다 엠마

<div class="leftnav">
    <div class="images">
        <div class="toptext">Filters
            <div class="btn">+ filter</div>
        </div>
        <div id="container">
            <div class="filters rem" id="f12">
                <div class="btn4" id="b4f12">Pupil name</div>
                <div class="btn2" id="b2f12">
                    =
                    <ul>
                        <li id="ddf_12_0">=</li>
                        <li id="ddf_12_1">></li>
                    </ul>
                </div>
                <div class="btn1" id="b1f12">Joe Bloggs</div>
                <div class="btn3" id="if12">x</div>
            </div>
            <div class="filters rem" id="f13">
                <div class="btn4" id="b4f13">Pupil name</div>
                <div class="btn2" id="b2f13">
                    =
                    <ul>
                        <li id="ddf_13_0">=</li>
                        <li id="ddf_13_1">></li>
                    </ul>
                </div>
                <div class="btn1" id="b1f13">Bill Clinton</div>
                <div class="btn3" id="if13">x</div>
            </div>
        </div>
    </div>
</div>